<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="theme-color" content="#333">
    <title>Material Style</title>
    <meta name="description" content="Material Style Theme">
    <link rel="shortcut icon" href="assets/img/favicon-v=3.png">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
    <link rel="stylesheet" href="assets/css/preload.min.css">
    <link rel="stylesheet" href="assets/css/plugins.min.css">
    <link rel="stylesheet" href="assets/css/style.light-blue-500.min.css">
    <link rel="stylesheet" href="assets/css/width-boxed.min.css" id="ms-boxed" disabled="">
    <!--[if lt IE 9]>
        <script src="assets/js/html5shiv.min.js"></script>
        <script src="assets/js/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <a href="javascript:void(0)" class="ms-conf-btn ms-configurator-btn btn-circle btn-circle-raised btn-circle-primary animated rubberBand">
      <i class="fa fa-gears"></i>
    </a>
    <div id="ms-configurator" class="ms-configurator">
      <div class="ms-configurator-title">
        <h3>
          <i class="fa fa-gear"></i> Theme Configurator</h3>
        <a href="javascript:void(0);" class="ms-conf-btn withripple">
          <i class="zmdi zmdi-close"></i>
        </a>
      </div>
      <div class="panel-group" id="accordion_conf" role="tablist" aria-multiselectable="true">
        <div class="panel panel-default">
          <div class="panel-heading" role="tab" id="ms-conf-header-color">
            <h4 class="panel-title">
              <a role="button" class="withripple" data-toggle="collapse" data-parent="#accordion_conf" href="#ms-collapse-conf-1" aria-expanded="true" aria-controls="ms-collapse-conf-1">
                <i class="zmdi zmdi-invert-colors"></i> Color Selector </a>
            </h4>
          </div>
          <div id="ms-collapse-conf-1" class="card-collapse collapse show" role="tabpanel" aria-labelledby="ms-conf-header-color">
            <div class="panel-body">
              <div id="color-options" class="ms-colors-container">
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary red" data-color="red">red</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary pink" data-color="pink">pink</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary purple" data-color="purple">purple</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary deep-purple" data-color="deep-purple">deep-purple</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary indigo" data-color="indigo">indigo</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary blue" data-color="blue">blue</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary light-blue active" data-color="light-blue">light-blue</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary cyan" data-color="cyan">cyan</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary teal" data-color="teal">teal</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary green" data-color="green">green</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary light-green" data-color="light-green">light-green</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary lime" data-color="lime">lime</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary yellow" data-color="yellow">yellow</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary amber" data-color="amber">amber</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary orange" data-color="orange">orange</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary deep-orange" data-color="deep-orange">deep-orange</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary brown" data-color="brown">brown</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary grey" data-color="grey">grey</a>
                <a href="javascript:void(0);" class="ms-color-box ms-color-box-primary blue-grey" data-color="blue-grey">blue-grey</a>
              </div>
              <div id="grad-options" class="ms-color-shine">
                <h4 class="no-mb text-center">Color Brightness</h4>
                <span>300</span>
                <span>400</span>
                <span>500</span>
                <span>600</span>
                <span>700</span>
                <span>800</span>
                <a href="javascript:void(0)" data-shine=300 class="ms-color-box grad c300 light-blue">300</a>
                <a href="javascript:void(0)" data-shine=400 class="ms-color-box grad c400 light-blue">400</a>
                <a href="javascript:void(0)" data-shine=500 class="ms-color-box grad c500 light-blue active">500</a>
                <a href="javascript:void(0)" data-shine=600 class="ms-color-box grad c600 light-blue">600</a>
                <a href="javascript:void(0)" data-shine=700 class="ms-color-box grad c700 light-blue">700</a>
                <a href="javascript:void(0)" data-shine=800 class="ms-color-box grad c800 light-blue">800</a>
              </div>
            </div>
          </div>
        </div>
        <div class="panel panel-default">
          <div class="panel-heading" role="tab" id="ms-conf-header-headers">
            <h4 class="panel-title">
              <a class="collapsed withripple" role="button" data-toggle="collapse" data-parent="#accordion_conf" href="#ms-collapse-conf-2" aria-expanded="false" aria-controls="ms-collapse-conf-2">
                <i class="zmdi zmdi-view-compact"></i> Header Styles </a>
            </h4>
          </div>
          <div id="ms-collapse-conf-2" class="card-collapse collapse" role="tabpanel" aria-labelledby="ms-conf-header-headers">
            <div class="panel-body">
              <!--<h5>Preset Options</h5>
                    <form class="form-inverse ms-conf-radio">
                        <div class="form-group">
                            <div class="radio radio-primary">
                                <label>
                                    <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked="">Default Style
                                </label>
                            </div>
                            <div class="radio radio-primary">
                                <label>
                                    <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">Pure Material
                                </label>
                            </div>
                            <div class="radio radio-primary">
                                <label>
                                    <input type="radio" name="optionsRadios" id="optionsRadios3" value="option3">Navbar Mode
                                </label>
                            </div>
                        </div>
                    </form>
                    <h5>Custom Header</h5>-->
              <h6>Header Options</h6>
              <form class="form-inverse ms-conf-radio" id="header-config">
                <div class="form-group">
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customHeader" id="whiteHeader" value="white" checked="cheked"> Light Color </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customHeader" id="primaryHeader" value="primary"> Primary Color </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customHeader" id="darkHeader" value="dark"> Dark Color </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customHeader" id="noHeader" value="hidden"> No Header (Navbar Mode) </label>
                  </div>
                </div>
              </form>
              <h6>Navbar Options</h6>
              <form class="form-inverse ms-conf-radio" id="navbar-config">
                <div class="form-group">
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customNavbar" id="whiteNavbar" value="white" checked=""> Light Color </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customNavbar" id="primaryNavbar" value="primary"> Primary Color </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customNavbar" id="darkNavbar" value="dark"> Dark Color </label>
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>
        <div class="panel panel-default">
          <div class="panel-heading" role="tab" id="ms-conf-header-container">
            <h4 class="panel-title">
              <a class="collapsed withripple" role="button" data-toggle="collapse" data-parent="#accordion_conf" href="#ms-conf-collapse-3" aria-expanded="false" aria-controls="ms-conf-collapse-3">
                <i class="zmdi zmdi-grid"></i> Container Options </a>
            </h4>
          </div>
          <div id="ms-conf-collapse-3" class="card-collapse collapse" role="tabpanel" aria-labelledby="ms-conf-header-container">
            <div class="panel-body">
              <form class="form-inverse ms-conf-radio" id="boxed-config">
                <div class="form-group">
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customWidth" id="fullWidth" value="full" checked=""> Full Width </label>
                  </div>
                  <div class="radio radio-primary">
                    <label>
                      <input type="radio" name="customWidth" id="boxedWidth" value="boxed"> Boxed Mode </label>
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div id="ms-preload" class="ms-preload">
      <div id="status">
        <div class="spinner">
          <div class="dot1"></div>
          <div class="dot2"></div>
        </div>
      </div>
    </div>
    <div class="ms-site-container">
      <!-- Modal -->
      <div class="modal modal-primary" id="ms-account-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog animated zoomIn animated-3x" role="document">
          <div class="modal-content">
            <div class="modal-header d-block shadow-2dp no-pb">
              <button type="button" class="close d-inline pull-right mt-2" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">
                  <i class="zmdi zmdi-close"></i>
                </span>
              </button>
              <div class="modal-title text-center">
                <span class="ms-logo ms-logo-white ms-logo-sm mr-1">M</span>
                <h3 class="no-m ms-site-title">Material
                  <span>Style</span>
                </h3>
              </div>
              <div class="modal-header-tabs">
                <ul class="nav nav-tabs nav-tabs-full nav-tabs-3 nav-tabs-primary" role="tablist">
                  <li class="nav-item" role="presentation">
                    <a href="#ms-login-tab" aria-controls="ms-login-tab" role="tab" data-toggle="tab" class="nav-link active withoutripple">
                      <i class="zmdi zmdi-account"></i> Login</a>
                  </li>
                  <li class="nav-item" role="presentation">
                    <a href="#ms-register-tab" aria-controls="ms-register-tab" role="tab" data-toggle="tab" class="nav-link withoutripple">
                      <i class="zmdi zmdi-account-add"></i> Register</a>
                  </li>
                  <li class="nav-item" role="presentation">
                    <a href="#ms-recovery-tab" aria-controls="ms-recovery-tab" role="tab" data-toggle="tab" class="nav-link withoutripple">
                      <i class="zmdi zmdi-key"></i> Recovery Pass</a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="modal-body">
              <div class="tab-content">
                <div role="tabpanel" class="tab-pane fade active show" id="ms-login-tab">
                  <form autocomplete="off">
                    <fieldset>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-account"></i>
                          </span>
                          <label class="control-label" for="ms-form-user">Username</label>
                          <input type="text" id="ms-form-user" class="form-control"> </div>
                      </div>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-lock"></i>
                          </span>
                          <label class="control-label" for="ms-form-pass">Password</label>
                          <input type="password" id="ms-form-pass" class="form-control"> </div>
                      </div>
                      <div class="row mt-2">
                        <div class="col-md-6">
                          <div class="form-group no-mt">
                            <div class="checkbox">
                              <label>
                                <input type="checkbox"> Remember Me </label>
                            </div>
                          </div>
                        </div>
                        <div class="col-md-6">
                          <button class="btn btn-raised btn-primary pull-right">Login</button>
                        </div>
                      </div>
                    </fieldset>
                  </form>
                  <div class="text-center">
                    <h3>Login with</h3>
                    <a href="javascript:void(0)" class="wave-effect-light btn btn-raised btn-facebook">
                      <i class="zmdi zmdi-facebook"></i> Facebook</a>
                    <a href="javascript:void(0)" class="wave-effect-light btn btn-raised btn-twitter">
                      <i class="zmdi zmdi-twitter"></i> Twitter</a>
                    <a href="javascript:void(0)" class="wave-effect-light btn btn-raised btn-google">
                      <i class="zmdi zmdi-google"></i> Google</a>
                  </div>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="ms-register-tab">
                  <form>
                    <fieldset>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-account"></i>
                          </span>
                          <label class="control-label" for="ms-form-user-new">Username</label>
                          <input type="text" id="ms-form-user-new" class="form-control"> </div>
                      </div>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-email"></i>
                          </span>
                          <label class="control-label" for="ms-form-email-new">Email</label>
                          <input type="email" id="ms-form-email-new" class="form-control"> </div>
                      </div>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-lock"></i>
                          </span>
                          <label class="control-label" for="ms-form-pass-new">Password</label>
                          <input type="password" id="ms-form-pass-new" class="form-control"> </div>
                      </div>
                      <div class="form-group label-floating">
                        <div class="input-group">
                          <span class="input-group-addon">
                            <i class="zmdi zmdi-lock"></i>
                          </span>
                          <label class="control-label" for="ms-form-pass-re-new">Re-type Password</label>
                          <input type="password" id="ms-form-pass-re-new" class="form-control"> </div>
                      </div>
                      <button class="btn btn-raised btn-block btn-primary">Register Now</button>
                    </fieldset>
                  </form>
                </div>
                <div role="tabpanel" class="tab-pane fade" id="ms-recovery-tab">
                  <fieldset>
                    <div class="form-group label-floating">
                      <div class="input-group">
                        <span class="input-group-addon">
                          <i class="zmdi zmdi-account"></i>
                        </span>
                        <label class="control-label" for="ms-form-user-re">Username</label>
                        <input type="text" id="ms-form-user-re" class="form-control"> </div>
                    </div>
                    <div class="form-group label-floating">
                      <div class="input-group">
                        <span class="input-group-addon">
                          <i class="zmdi zmdi-email"></i>
                        </span>
                        <label class="control-label" for="ms-form-email-re">Email</label>
                        <input type="email" id="ms-form-email-re" class="form-control"> </div>
                    </div>
                    <button class="btn btn-raised btn-block btn-primary">Send Password</button>
                  </fieldset>
                  </form>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <header class="ms-header ms-header-primary">
        <!--ms-header-primary-->
        <div class="container container-full">
          <div class="ms-title">
            <a href="index.html">
              <!-- <img src="assets/img/demo/logo-header.png" alt=""> -->
              <span class="ms-logo animated zoomInDown animation-delay-5">M</span>
              <h1 class="animated fadeInRight animation-delay-6">Material
                <span>Style</span>
              </h1>
            </a>
          </div>
          <div class="header-right">
            <div class="share-menu">
              <ul class="share-menu-list">
                <li class="animated fadeInRight animation-delay-3">
                  <a href="javascript:void(0)" class="btn-circle btn-google">
                    <i class="zmdi zmdi-google"></i>
                  </a>
                </li>
                <li class="animated fadeInRight animation-delay-2">
                  <a href="javascript:void(0)" class="btn-circle btn-facebook">
                    <i class="zmdi zmdi-facebook"></i>
                  </a>
                </li>
                <li class="animated fadeInRight animation-delay-1">
                  <a href="javascript:void(0)" class="btn-circle btn-twitter">
                    <i class="zmdi zmdi-twitter"></i>
                  </a>
                </li>
              </ul>
              <a href="javascript:void(0)" class="btn-circle btn-circle-primary animated zoomInDown animation-delay-7">
                <i class="zmdi zmdi-share"></i>
              </a>
            </div>
            <a href="javascript:void(0)" class="btn-circle btn-circle-primary no-focus animated zoomInDown animation-delay-8" data-toggle="modal" data-target="#ms-account-modal">
              <i class="zmdi zmdi-account"></i>
            </a>
            <form class="search-form animated zoomInDown animation-delay-9">
              <input id="search-box" type="text" class="search-input" placeholder="Search..." name="q" />
              <label for="search-box">
                <i class="zmdi zmdi-search"></i>
              </label>
            </form>
            <a href="javascript:void(0)" class="btn-ms-menu btn-circle btn-circle-primary ms-toggle-left animated zoomInDown animation-delay-10">
              <i class="zmdi zmdi-menu"></i>
            </a>
          </div>
        </div>
      </header>
      <nav class="navbar navbar-expand-md  navbar-static ms-navbar ms-navbar-primary">
        <div class="container container-full">
          <div class="navbar-header">
            <a class="navbar-brand" href="index.html">
              <!-- <img src="assets/img/demo/logo-navbar.png" alt=""> -->
              <span class="ms-logo ms-logo-sm">M</span>
              <span class="ms-title">Material
                <strong>Style</strong>
              </span>
            </a>
          </div>
          <div class="collapse navbar-collapse" id="ms-navbar">
            <ul class="navbar-nav">
              <li class="nav-item dropdown active">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="home">Home
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu">
                  <li class="ms-tab-menu">
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs ms-tab-menu-left" role="tablist">
                      <li class="nav-item">
                        <a class="nav-link active" href="#tab-general" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-home"></i> General Purpose</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-landing" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-desktop-windows"></i> Landing pages</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-revolution" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-panorama-horizontal"></i> Slider Revolution</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-shop" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-store"></i> Shop</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-profile" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-account"></i> Professional Profile</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-blog" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-edit"></i> Blog Template</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-magazine" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-flip"></i> Magazine Template</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-app" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-smartphone-iphone"></i> App Pages</a>
                      </li>
                      <li class="nav-item">
                        <a class="nav-link" href="#tab-ads" data-hover="tab" data-toggle="tab" role="tab">
                          <i class="zmdi zmdi-search"></i> Classified Ads</a>
                      </li>
                    </ul>
                    <!-- Tab panes -->
                    <div class="tab-content ms-tab-menu-right">
                      <div class="tab-pane active" id="tab-general" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="index.html">Default Home</a>
                          </li>
                          <li>
                            <a href="home-generic-2.html">Home Black Slider</a>
                          </li>
                          <li>
                            <a href="home-generic-3.html">Home Browsers Intro</a>
                          </li>
                          <li>
                            <a href="home-generic-4.html">Home Mobile Intro</a>
                          </li>
                          <li>
                            <a href="home-generic-5.html">Home Material Icons</a>
                          </li>
                          <li>
                            <a href="home-generic-6.html">Home Typed Hero</a>
                          </li>
                          <li>
                            <a href="home-generic-7.html">Home Typed Hero 2</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-landing" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-landing.html">Home Landing Intro</a>
                          </li>
                          <li>
                            <a href="home-landing2.html">Home Landing Intro 2</a>
                          </li>
                          <li>
                            <a href="home-landing4.html">Home Landing Intro 3</a>
                          </li>
                          <li>
                            <a href="home-landing3.html">Home Landing Video</a>
                          </li>
                          <li>
                            <a href="home-cv3.html">Home Profile Landing 1</a>
                          </li>
                          <li>
                            <a href="home-cv4.html">Home Profile Landing 2</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Landing Video 2 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-revolution" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a class="with-badge" href="home-revolution.html">Home Revolution Devices
                              <span class="badge badge-success pull-right">1.3</span>
                            </a>
                          </li>
                          <li>
                            <a class="with-badge" href="home-revolution2.html">Home Revolution App
                              <span class="badge badge-success pull-right">1.3</span>
                            </a>
                          </li>
                          <li>
                            <a class="with-badge" href="home-revolution3.html">Home Revolution Video
                              <span class="badge badge-success pull-right">1.3</span>
                            </a>
                          </li>
                          <li>
                            <a class="with-badge" href="home-revolution4.html">Home Revolution Idea
                              <span class="badge badge-success pull-right">1.3</span>
                            </a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-shop" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-shop.html">Home Shop 1</a>
                          </li>
                          <li>
                            <a href="home-shop2.html">Home Shop 2</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home Shop 3 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home Shop 4 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-profile" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-cv.html">Home Profile 1</a>
                          </li>
                          <li>
                            <a href="home-cv2.html">Home Profile 2</a>
                          </li>
                          <li>
                            <a href="home-cv3.html">Home Profile Landing 1</a>
                          </li>
                          <li>
                            <a href="home-cv4.html">Home Profile Landing 2</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-blog" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-blog.html">Home Blog 1</a>
                          </li>
                          <li>
                            <a href="home-blog2.html">Home Blog 2</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home Blog 3 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home Blog 4 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-magazine" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-magazine.html">Home Magazine 1</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Magazine 2 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Magazine 3 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Magazine 4 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-app" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-app.html">Home App 1</a>
                          </li>
                          <li>
                            <a href="home-app2.html">Home App 2</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home App 3 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Home App 4 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                      <div class="tab-pane" id="tab-ads" role="tabpanel">
                        <ul class="ms-tab-menu-right-container">
                          <li>
                            <a href="home-class.html">Home Classifieds 1</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Classifieds 2 (Next Update)</a>
                          </li>
                          <li class="disable">
                            <a href="javascript:void(0)">Classifieds 3 (Next Update)</a>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </li>
                </ul>
              </li>
              <li class="nav-item dropdown">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="page">Pages
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu">
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="dropdown-item has_children">About us &amp; Team</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-about.html">About us Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-about2.html">About us Option 2</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-about3.html">About us Option 3</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-about4.html">About us Option 4</a>
                      </li>
                      <li class="dropdown-divider"></li>
                      <li>
                        <a class="dropdown-item" href="page-team.html">Our Team Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-team2.html">Our Team Option 2</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Form</a>
                    <ul class="dropdown-menu">
                      <li>
                        <a class="dropdown-item" href="page-contact.html">Contact Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-contact2.html">Contact Option 2</a>
                      </li>
                      <li class="dropdown-divider"></li>
                      <li>
                        <a class="dropdown-item" href="page-login_register.html">Login &amp; Register</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-login.html">Login Full</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-login2.html">Login Integrated</a>
                      </li>
                      <li class="dropdown-divider"></li>
                      <li>
                        <a class="dropdown-item" href="page-login_register2.html">Register Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-register2.html">Register Option 2</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Profiles</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-profile.html">User Profile Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-profile2.html">User Profile Option 2</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Error</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-404.html">Error 404 Full Page</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-404_2.html">Error 404 Integrated</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-500.html">Error 500 Full Page</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-500_2.html">Error 500 Integrated</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Bussiness &amp; Products</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-testimonial.html">Testimonials</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-clients.html">Our Clients</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-product.html">Products</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-services.html">Services</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Pricing</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-pricing.html">Pricing Box</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-pricing2.html">Pricing Box 2</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-princing_table.html">Pricing Mega Table</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">FAQ &amp; Support</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-support.html">Support Center</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-faq.html">FAQ Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-faq2.html">FAQ Option 2</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Coming Soon</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-coming.html">Coming Soon Option 1</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-coming2.html">Coming Soon Option 2</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-coming3.html">Coming Soon Option 3</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Timeline</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item" href="page-timeline_left.html">Timeline Left</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-timeline_left2.html">Timeline Left 2</a>
                      </li>
                      <li>
                        <a class="dropdown-item" href="page-timeline.html">Timeline Center</a>
                      </li>
                    </ul>
                  </li>
                  <li class="dropdown-submenu">
                    <a href="javascript:void(0)" class="has_children dropdown-item">Email Templates</a>
                    <ul class="dropdown-menu dropdown-menu-left">
                      <li>
                        <a class="dropdown-item with-badge" href="page-email.html">Email Template 1
                          <span class="badge badge-success text-right">1.2</span>
                        </a>
                        </a>
                      </li>
                      <li>
                        <a class="dropdown-item with-badge" href="page-email2.html">Email Template 2
                          <span class="badge badge-success text-right">1.2</span>
                        </a>
                        </a>
                      </li>
                    </ul>
                  </li>
                  <li>
                    <a class="dropdown-item" href="page-all.html" class="dropdown-link">All Pages</a>
                  </li>
                </ul>
              </li>
              <li class="nav-item dropdown dropdown-megamenu-container">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="component">UI Elements
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu dropdown-megamenu animated fadeIn animated-2x">
                  <li class="container">
                    <div class="row">
                      <div class="col-sm-3 megamenu-col">
                        <div class="megamenu-block animated fadeInLeft animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="fa fa-bold"></i> Bootstrap CSS</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-typography.html">
                                <i class="fa fa-font"></i> Typography</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-headers.html">
                                <i class="fa fa-header"></i> Headers</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-dividers.html">
                                <i class="fa fa-arrows-h"></i> Dividers</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-blockquotes.html">
                                <i class="fa fa-quote-right"></i> Blockquotes</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-forms.html">
                                <i class="fa fa-check-square-o"></i> Forms
                                <span class="badge badge-info pull-right">
                                  <i class="zmdi zmdi-long-arrow-up no-mr"></i> 1.5</span>
                              </a>
                            </li>
                            <li>
                              <a class="withripple" href="component-tables.html">
                                <i class="fa fa-table"></i> Tables</a>
                            </li>
                          </ul>
                        </div>
                        <div class="megamenu-block animated fadeInLeft animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="fa fa-hand-o-up"></i> Buttons</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-basic-buttons.html">
                                <i class="fa fa-arrow-circle-right"></i> Basic Buttons</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-buttons-components.html">
                                <i class="fa fa-arrow-circle-right"></i> Buttons Components</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-social-buttons.html">
                                <i class="fa fa-arrow-circle-right"></i> Social Buttons
                                <span class="badge badge-info pull-right">
                                  <i class="zmdi zmdi-long-arrow-up no-mr"></i> 1.3</span>
                              </a>
                            </li>
                          </ul>
                        </div>
                      </div>
                      <div class="col-sm-3 megamenu-col">
                        <div class="megamenu-block animated fadeInLeft animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="fa fa-list-alt"></i> Basic Components</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-panels.html">
                                <i class="zmdi zmdi-view-agenda"></i> Panels</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-alerts.html">
                                <i class="zmdi zmdi-info"></i> Alerts &amp; Wells</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-badges.html">
                                <i class="zmdi zmdi-tag"></i> Badges &amp; Badges Pills</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-lists.html">
                                <i class="zmdi zmdi-view-list"></i> Lists</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-thumbnails.html">
                                <i class="zmdi zmdi-image-o"></i> Thumbnails</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-carousels.html">
                                <i class="zmdi zmdi-view-carousel"></i> Carousels</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-modals.html">
                                <i class="zmdi zmdi-window-maximize"></i> Modals</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-tooltip.html">
                                <i class="zmdi zmdi-pin-help"></i> Tooltip &amp; Popover</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-progress-bars.html">
                                <i class="zmdi zmdi-view-headline"></i> Progress Bars</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-pagination.html">
                                <i class="zmdi zmdi-n-2-square"></i> Pagination</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-dropdowns.html">
                                <i class="fa fa-info"></i> Dropdowns</a>
                            </li>
                          </ul>
                        </div>
                      </div>
                      <div class="col-sm-3 megamenu-col">
                        <div class="megamenu-block animated fadeInRight animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="zmdi zmdi-folder-star-alt"></i> Extra Components</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-cards.html">
                                <i class="zmdi zmdi-card-membership"></i> Cards</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-composite-cards.html">
                                <i class="zmdi zmdi-card-giftcard"></i> Composite Cards</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-counters.html">
                                <i class="zmdi zmdi-n-6-square"></i> Counters</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-audio-video.html">
                                <i class="zmdi zmdi-play-circle"></i> Audio &amp; Video</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-masonry.html">
                                <i class="zmdi zmdi-view-dashboard"></i> Masonry Layer</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-snackbar.html">
                                <i class="zmdi zmdi-notifications-active"></i> SnackBar
                                <span class="badge badge-success pull-right">1.2</span>
                              </a>
                            </li>
                            <li>
                              <a class="withripple" href="component-lightbox.html">
                                <i class="zmdi zmdi-collection-image-o"></i> Lightbox
                                <span class="badge badge-success pull-right">1.5</span>
                              </a>
                            </li>
                          </ul>
                        </div>
                        <div class="megamenu-block animated fadeInRight animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="zmdi zmdi-tab"></i> Collapses &amp; Tabs</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-collapses.html">
                                <i class="zmdi zmdi-view-day"></i> Collapses</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-horizontal-tabs.html">
                                <i class="zmdi zmdi-tab"></i> Horitzontal Tabs</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-vertical-tabs.html">
                                <i class="zmdi zmdi-menu"></i> Vertical Tabs</a>
                            </li>
                          </ul>
                        </div>
                      </div>
                      <div class="col-sm-3 megamenu-col">
                        <div class="megamenu-block animated fadeInRight animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="fa fa-briefcase"></i> Icons</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-icons-basic.html">
                                <i class="fa fa-arrow-circle-right"></i> Basic Icons</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-icons-fontawesome.html">
                                <i class="fa fa-arrow-circle-right"></i> Font Awesome</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-icons-iconic.html">
                                <i class="fa fa-arrow-circle-right"></i> Material Design Iconic</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-icons-glyphicons.html">
                                <i class="fa fa-arrow-circle-right"></i> Glyphicons</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-icons-ionicons.html">
                                <i class="fa fa-arrow-circle-right"></i> Ionicons
                                <span class="badge badge-success pull-right">2.0</span>
                              </a>
                            </li>
                          </ul>
                        </div>
                        <div class="megamenu-block animated fadeInRight animated-2x">
                          <h3 class="megamenu-block-title">
                            <i class="fa fa-area-chart"></i> Charts</h3>
                          <ul class="megamenu-block-list">
                            <li>
                              <a class="withripple" href="component-charts-circle.html">
                                <i class="zmdi zmdi-chart-donut"></i> Circle Charts</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-charts-bar.html">
                                <i class="fa fa-bar-chart"></i> Bars Charts</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-charts-line.html">
                                <i class="fa fa-line-chart"></i> Line Charts</a>
                            </li>
                            <li>
                              <a class="withripple" href="component-charts-more.html">
                                <i class="fa fa-pie-chart"></i> More Charts</a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </li>
                </ul>
              </li>
              <li class="nav-item dropdown">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-7" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="blog">Blog
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu">
                  <li>
                    <a class="dropdown-item" href="blog-sidebar.html">
                      <i class="zmdi zmdi-view-compact"></i> Blog Sidebar 1</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-sidebar2.html">
                      <i class="zmdi zmdi-view-compact"></i> Blog Sidebar 2</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-masonry.html">
                      <i class="zmdi zmdi-view-dashboard"></i> Blog Masonry 1</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-masonry2.html">
                      <i class="zmdi zmdi-view-dashboard"></i> Blog Masonry 2</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-full.html">
                      <i class="zmdi zmdi zmdi-view-stream"></i> Blog Full Page 1</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-full2.html">
                      <i class="zmdi zmdi zmdi-view-stream"></i> Blog Full Page 2</a>
                  </li>
                  <li class="dropdown-divider"></li>
                  <li>
                    <a class="dropdown-item" href="blog-post.html">
                      <i class="zmdi zmdi-file-text"></i> Blog Post 1</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="blog-post2.html">
                      <i class="zmdi zmdi-file-text"></i> Blog Post 2</a>
                  </li>
                </ul>
              </li>
              <li class="nav-item dropdown">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-8" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="portfolio">Portfolio
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu">
                  <li>
                    <a class="dropdown-item" href="portfolio-filters_sidebar.html">
                      <i class="zmdi zmdi-view-compact"></i> Portfolio Sidebar Filters</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-filters_topbar.html">
                      <i class="zmdi zmdi-view-agenda"></i> Portfolio Topbar Filters</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-filters_sidebar_fluid.html">
                      <i class="zmdi zmdi-view-compact"></i> Portfolio Sidebar Fluid</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-filters_topbar_fluid.html">
                      <i class="zmdi zmdi-view-agenda"></i> Portfolio Topbar Fluid</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-cards.html">
                      <i class="zmdi zmdi-card-membership"></i> Porfolio Cards</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-masonry.html">
                      <i class="zmdi zmdi-view-dashboard"></i> Porfolio Masonry</a>
                  </li>
                  <li>
                    <a class="dropdown-item with-badge" href="portfolio-gallery.html">
                      <i class="zmdi zmdi-apps"></i> Picture Gallery
                      <span class="badge badge-success text-right">1.5</span>
                    </a>
                  </li>
                  <li class="dropdown-divider"></li>
                  <li>
                    <a class="dropdown-item" href="portfolio-item.html">
                      <i class="zmdi zmdi-collection-item-1"></i> Portfolio Item 1</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="portfolio-item2.html">
                      <i class="zmdi zmdi-collection-item-2"></i> Portfolio Item 2</a>
                  </li>
                </ul>
              </li>
              <li class="nav-item dropdown">
                <a href="#" class="nav-link dropdown-toggle animated fadeIn animation-delay-9" data-toggle="dropdown" data-hover="dropdown" role="button" aria-haspopup="true" aria-expanded="false" data-name="ecommerce">E-Commerce
                  <i class="zmdi zmdi-chevron-down"></i>
                </a>
                <ul class="dropdown-menu">
                  <li>
                    <a class="dropdown-item" href="ecommerce-filters.html">E-Commerce Sidebar</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="ecommerce-filters-full.html">E-Commerce Sidebar Full</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="ecommerce-filters-full2.html">E-Commerce Topbar Full</a>
                  </li>
                  <li class="dropdown-divider"></li>
                  <li>
                    <a class="dropdown-item" href="ecommerce-item.html">E-Commerce Item</a>
                  </li>
                  <li>
                    <a class="dropdown-item" href="ecommerce-cart.html">E-Commerce Cart</a>
                  </li>
                </ul>
              </li>
            </ul>
          </div>
          <a href="javascript:void(0)" class="ms-toggle-left btn-navbar-menu">
            <i class="zmdi zmdi-menu"></i>
          </a>
        </div>
        <!-- container -->
      </nav>
      <div class="material-background"></div>
      <div class="container container-full">
        <div class="ms-paper">
          <div class="row">
            <div class="col-lg-3 ms-paper-menu-left-container">
              <div class="ms-paper-menu-left">
                <h3 class="ms-paper-menu-title">
                  <i class="zmdi zmdi-apps"></i> Components Menu
                  <a role="button" data-toggle="collapse" href="#collapseMenu" aria-expanded="false" aria-controls="collapseMenu" class="withripple">
                    <i class="zmdi zmdi-menu"></i>
                  </a>
                </h3>
                <div class="panel-menu collapse" id="collapseMenu">
                  <ul class="panel-group ms-collapse-nav" id="components-nav" role="tablist" aria-multiselectable="true">
                    <li class="card" role="tab" id="e1">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c1" aria-expanded="true" aria-controls="c1" class="collapsed withripple">
                        <i class="fa fa-bold"></i> Bootstrap CSS</a>
                      <ul id="c1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e1">
                        <li>
                          <a class="withripple" href="component-typography.html">
                            <i class="fa fa-font"></i> Typography</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-headers.html">
                            <i class="fa fa-header"></i> Headers</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-dividers.html">
                            <i class="fa fa-arrows-h"></i> Dividers</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-blockquotes.html">
                            <i class="fa fa-quote-right"></i> Blockquotes</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-forms.html">
                            <i class="fa fa-check-square-o"></i> Forms</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-tables.html">
                            <i class="fa fa-table"></i> Tables</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e2">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c2" aria-expanded="true" aria-controls="c2" class="collapsed withripple">
                        <i class="fa fa-hand-o-up"></i> Buttons</a>
                      <ul id="c2" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e2">
                        <li>
                          <a class="withripple" href="component-basic-buttons.html">
                            <i class="fa fa-arrow-circle-right"></i> Basic Buttons</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-buttons-components.html">
                            <i class="fa fa-arrow-circle-right"></i> Buttons Components</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-social-buttons.html">
                            <i class="fa fa-arrow-circle-right"></i> Social Buttons</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e3">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c3" aria-expanded="true" aria-controls="c3" class="withripple">
                        <i class="fa fa-briefcase"></i> Icons</a>
                      <ul id="c3" class="panel-collapse collapse show" role="tabpanel" aria-labelledby="e3">
                        <li>
                          <a class="withripple" href="component-icons-basic.html">
                            <i class="fa fa-arrow-circle-right"></i> Basic Icons</a>
                        </li>
                        <li>
                          <a class="withripple active" href="component-icons-fontawesome.html">
                            <i class="fa fa-arrow-circle-right"></i> Font Awesome</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-icons-iconic.html">
                            <i class="fa fa-arrow-circle-right"></i> Material Design Iconic</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-icons-glyphicons.html">
                            <i class="fa fa-arrow-circle-right"></i> Glyphicons</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-icons-ionicons.html">
                            <i class="fa fa-arrow-circle-right"></i> Ionicons</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e4">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c4" aria-expanded="true" aria-controls="c4" class="collapsed withripple">
                        <i class="fa fa-list-alt"></i> Basic Components</a>
                      <ul id="c4" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e4">
                        <li>
                          <a class="withripple" href="component-panels.html">
                            <i class="zmdi zmdi-view-agenda"></i> Panels</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-alerts.html">
                            <i class="zmdi zmdi-info"></i> Alerts &amp; Wells</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-badges.html">
                            <i class="zmdi zmdi-tag"></i> Badges &amp; Badges Pills</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-lists.html">
                            <i class="zmdi zmdi-view-list"></i> Lists</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-thumbnails.html">
                            <i class="zmdi zmdi-image-o"></i> Thumbnails</a>
                          </a>
                        </li>
                        <li>
                          <a class="withripple" href="component-carousels.html">
                            <i class="zmdi zmdi-view-carousel"></i> Carousels</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-modals.html">
                            <i class="zmdi zmdi-window-maximize"></i> Modals</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-tooltip.html">
                            <i class="zmdi zmdi-pin-help"></i> Tooltip &amp; Popover</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-progress-bars.html">
                            <i class="zmdi zmdi-view-headline"></i> Progress Bars</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-pagination.html">
                            <i class="zmdi zmdi-n-2-square"></i> Pagination</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-dropdowns.html">
                            <i class="fa fa-info"></i> Dropdowns</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e5">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c5" aria-expanded="true" aria-controls="c5" class="collapsed withripple">
                        <i class="zmdi zmdi-folder-star-alt"></i> Extra Components</a>
                      <ul id="c5" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e5">
                        <li>
                          <a class="withripple" href="component-cards.html">
                            <i class="zmdi zmdi-card-membership"></i> Cards</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-composite-cards.html">
                            <i class="zmdi zmdi-card-giftcard"></i> Composite Cards</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-counters.html">
                            <i class="zmdi zmdi-n-6-square"></i> Counters</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-audio-video.html">
                            <i class="zmdi zmdi-play-circle"></i> Audio &amp; Video</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-masonry.html">
                            <i class="zmdi zmdi-apps"></i> Masonry Layer</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-snackbar.html">
                            <i class="zmdi zmdi-notifications-active"></i> SnackBar</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-lightbox.html">
                            <i class="zmdi zmdi-collection-image-o"></i> Lightbox</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e6">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c6" aria-expanded="true" aria-controls="c6" class="collapsed withripple">
                        <i class="zmdi zmdi-tab"></i> Collapses &amp; Tabs</a>
                      <ul id="c6" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e6">
                        <li>
                          <a class="withripple" href="component-collapses.html">
                            <i class="zmdi zmdi-view-day"></i> Collapses</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-horizontal-tabs.html">
                            <i class="zmdi zmdi-tab"></i> Horitzontal Tabs</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-vertical-tabs.html">
                            <i class="zmdi zmdi-menu"></i> Vertical Tabs</a>
                        </li>
                      </ul>
                    </li>
                    <li class="card" role="tab" id="e7">
                      <a role="button" data-toggle="collapse" data-parent="#components-nav" href="#c7" aria-expanded="true" aria-controls="c7" class="collapsed withripple">
                        <i class="fa fa-area-chart"></i> Charts</a>
                      <ul id="c7" class="panel-collapse collapse" role="tabpanel" aria-labelledby="e7">
                        <li>
                          <a class="withripple" href="component-charts-circle.html">
                            <i class<i class="zmdi zmdi-chart-donut"></i> Circle Charts</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-charts-bar.html">
                            <i class="fa fa-bar-chart"></i> Bars Charts</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-charts-line.html">
                            <i class="fa fa-line-chart"></i> Line Charts</a>
                        </li>
                        <li>
                          <a class="withripple" href="component-charts-more.html">
                            <i class="fa fa-pie-chart"></i> More Charts</a>
                        </li>
                      </ul>
                    </li>
                  </ul>
                  <!-- ms-collapse-nav -->
                </div>
              </div>
            </div>
            <!-- col-lg-3 -->
            <div class="col-lg-9 ms-paper-content-container">
              <div class="ms-paper-content">
                <h1>Font Awesome Icons</h1>
                <p class="alert alert-light alert-info">
                  <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                  <i class="fa fa-flag"></i>All icons in Font Awesome available with Material Style Template! If you want more information about how to use them, you can visit
                  <a href="http://fortawesome.github.io/Font-Awesome/">official site</a>. </p>
                <section class="ms-component-section">
                  <section id="new">
                    <h2 class="color-primary mt-4 mb-2">41 New Icons in 4.7</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-book">
                          <i class="mr-2 fa fa-address-book"></i> address-book</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-book-o">
                          <i class="mr-2 fa fa-address-book-o"></i> address-book-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card">
                          <i class="mr-2 fa fa-address-card"></i> address-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card-o">
                          <i class="mr-2 fa fa-address-card-o"></i> address-card-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bandcamp">
                          <i class="mr-2 fa fa-bandcamp"></i> bandcamp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-bath"></i> bath</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-bathtub"></i> bathtub </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card">
                          <i class="mr-2 fa fa-drivers-license"></i> drivers-license </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card-o">
                          <i class="mr-2 fa fa-drivers-license-o"></i> drivers-license-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eercast">
                          <i class="mr-2 fa fa-eercast"></i> eercast</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-open">
                          <i class="mr-2 fa fa-envelope-open"></i> envelope-open</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-open-o">
                          <i class="mr-2 fa fa-envelope-open-o"></i> envelope-open-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/etsy">
                          <i class="mr-2 fa fa-etsy"></i> etsy</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/free-code-camp">
                          <i class="mr-2 fa fa-free-code-camp"></i> free-code-camp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/grav">
                          <i class="mr-2 fa fa-grav"></i> grav</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/handshake-o">
                          <i class="mr-2 fa fa-handshake-o"></i> handshake-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-badge">
                          <i class="mr-2 fa fa-id-badge"></i> id-badge</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card">
                          <i class="mr-2 fa fa-id-card"></i> id-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card-o">
                          <i class="mr-2 fa fa-id-card-o"></i> id-card-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/imdb">
                          <i class="mr-2 fa fa-imdb"></i> imdb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/linode">
                          <i class="mr-2 fa fa-linode"></i> linode</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/meetup">
                          <i class="mr-2 fa fa-meetup"></i> meetup</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/microchip">
                          <i class="mr-2 fa fa-microchip"></i> microchip</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/podcast">
                          <i class="mr-2 fa fa-podcast"></i> podcast</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/quora">
                          <i class="mr-2 fa fa-quora"></i> quora</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ravelry">
                          <i class="mr-2 fa fa-ravelry"></i> ravelry</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-s15"></i> s15 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shower">
                          <i class="mr-2 fa fa-shower"></i> shower</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/snowflake-o">
                          <i class="mr-2 fa fa-snowflake-o"></i> snowflake-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/superpowers">
                          <i class="mr-2 fa fa-superpowers"></i> superpowers</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/telegram">
                          <i class="mr-2 fa fa-telegram"></i> telegram</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer"></i> thermometer </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-empty">
                          <i class="mr-2 fa fa-thermometer-0"></i> thermometer-0 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-quarter">
                          <i class="mr-2 fa fa-thermometer-1"></i> thermometer-1 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-half">
                          <i class="mr-2 fa fa-thermometer-2"></i> thermometer-2 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-three-quarters">
                          <i class="mr-2 fa fa-thermometer-3"></i> thermometer-3 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer-4"></i> thermometer-4 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-empty">
                          <i class="mr-2 fa fa-thermometer-empty"></i> thermometer-empty</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer-full"></i> thermometer-full</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-half">
                          <i class="mr-2 fa fa-thermometer-half"></i> thermometer-half</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-quarter">
                          <i class="mr-2 fa fa-thermometer-quarter"></i> thermometer-quarter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-three-quarters">
                          <i class="mr-2 fa fa-thermometer-three-quarters"></i> thermometer-three-quarters</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close">
                          <i class="mr-2 fa fa-times-rectangle"></i> times-rectangle </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close-o">
                          <i class="mr-2 fa fa-times-rectangle-o"></i> times-rectangle-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-circle">
                          <i class="mr-2 fa fa-user-circle"></i> user-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-circle-o">
                          <i class="mr-2 fa fa-user-circle-o"></i> user-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-o">
                          <i class="mr-2 fa fa-user-o"></i> user-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card">
                          <i class="mr-2 fa fa-vcard"></i> vcard </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card-o">
                          <i class="mr-2 fa fa-vcard-o"></i> vcard-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close">
                          <i class="mr-2 fa fa-window-close"></i> window-close</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close-o">
                          <i class="mr-2 fa fa-window-close-o"></i> window-close-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-maximize">
                          <i class="mr-2 fa fa-window-maximize"></i> window-maximize</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-minimize">
                          <i class="mr-2 fa fa-window-minimize"></i> window-minimize</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-restore">
                          <i class="mr-2 fa fa-window-restore"></i> window-restore</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wpexplorer">
                          <i class="mr-2 fa fa-wpexplorer"></i> wpexplorer</a>
                      </div>
                    </div>
                  </section>
                  <section id="web-application">
                    <h2 class="color-primary mt-4 mb-2">Web Application Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-book">
                          <i class="mr-2 fa fa-address-book"></i> address-book</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-book-o">
                          <i class="mr-2 fa fa-address-book-o"></i> address-book-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card">
                          <i class="mr-2 fa fa-address-card"></i> address-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card-o">
                          <i class="mr-2 fa fa-address-card-o"></i> address-card-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/adjust">
                          <i class="mr-2 fa fa-adjust"></i> adjust</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/american-sign-language-interpreting">
                          <i class="mr-2 fa fa-american-sign-language-interpreting"></i> american-sign-language-interpreting</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/anchor">
                          <i class="mr-2 fa fa-anchor"></i> anchor</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/archive">
                          <i class="mr-2 fa fa-archive"></i> archive</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/area-chart">
                          <i class="mr-2 fa fa-area-chart"></i> area-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows">
                          <i class="mr-2 fa fa-arrows"></i> arrows</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-h">
                          <i class="mr-2 fa fa-arrows-h"></i> arrows-h</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-v">
                          <i class="mr-2 fa fa-arrows-v"></i> arrows-v</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/american-sign-language-interpreting">
                          <i class="mr-2 fa fa-asl-interpreting"></i> asl-interpreting </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/assistive-listening-systems">
                          <i class="mr-2 fa fa-assistive-listening-systems"></i> assistive-listening-systems</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/asterisk">
                          <i class="mr-2 fa fa-asterisk"></i> asterisk</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/at">
                          <i class="mr-2 fa fa-at"></i> at</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/audio-description">
                          <i class="mr-2 fa fa-audio-description"></i> audio-description</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/car">
                          <i class="mr-2 fa fa-automobile"></i> automobile </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/balance-scale">
                          <i class="mr-2 fa fa-balance-scale"></i> balance-scale</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ban">
                          <i class="mr-2 fa fa-ban"></i> ban</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/university">
                          <i class="mr-2 fa fa-bank"></i> bank </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bar-chart">
                          <i class="mr-2 fa fa-bar-chart"></i> bar-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bar-chart">
                          <i class="mr-2 fa fa-bar-chart-o"></i> bar-chart-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/barcode">
                          <i class="mr-2 fa fa-barcode"></i> barcode</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bars">
                          <i class="mr-2 fa fa-bars"></i> bars</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-bath"></i> bath</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-bathtub"></i> bathtub </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-full">
                          <i class="mr-2 fa fa-battery"></i> battery </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-empty">
                          <i class="mr-2 fa fa-battery-0"></i> battery-0 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-quarter">
                          <i class="mr-2 fa fa-battery-1"></i> battery-1 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-half">
                          <i class="mr-2 fa fa-battery-2"></i> battery-2 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-three-quarters">
                          <i class="mr-2 fa fa-battery-3"></i> battery-3 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-full">
                          <i class="mr-2 fa fa-battery-4"></i> battery-4 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-empty">
                          <i class="mr-2 fa fa-battery-empty"></i> battery-empty</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-full">
                          <i class="mr-2 fa fa-battery-full"></i> battery-full</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-half">
                          <i class="mr-2 fa fa-battery-half"></i> battery-half</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-quarter">
                          <i class="mr-2 fa fa-battery-quarter"></i> battery-quarter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/battery-three-quarters">
                          <i class="mr-2 fa fa-battery-three-quarters"></i> battery-three-quarters</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bed">
                          <i class="mr-2 fa fa-bed"></i> bed</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/beer">
                          <i class="mr-2 fa fa-beer"></i> beer</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bell">
                          <i class="mr-2 fa fa-bell"></i> bell</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bell-o">
                          <i class="mr-2 fa fa-bell-o"></i> bell-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bell-slash">
                          <i class="mr-2 fa fa-bell-slash"></i> bell-slash</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bell-slash-o">
                          <i class="mr-2 fa fa-bell-slash-o"></i> bell-slash-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bicycle">
                          <i class="mr-2 fa fa-bicycle"></i> bicycle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/binoculars">
                          <i class="mr-2 fa fa-binoculars"></i> binoculars</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/birthday-cake">
                          <i class="mr-2 fa fa-birthday-cake"></i> birthday-cake</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/blind">
                          <i class="mr-2 fa fa-blind"></i> blind</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bluetooth">
                          <i class="mr-2 fa fa-bluetooth"></i> bluetooth</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bluetooth-b">
                          <i class="mr-2 fa fa-bluetooth-b"></i> bluetooth-b</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bolt">
                          <i class="mr-2 fa fa-bolt"></i> bolt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bomb">
                          <i class="mr-2 fa fa-bomb"></i> bomb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/book">
                          <i class="mr-2 fa fa-book"></i> book</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bookmark">
                          <i class="mr-2 fa fa-bookmark"></i> bookmark</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bookmark-o">
                          <i class="mr-2 fa fa-bookmark-o"></i> bookmark-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/braille">
                          <i class="mr-2 fa fa-braille"></i> braille</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/briefcase">
                          <i class="mr-2 fa fa-briefcase"></i> briefcase</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bug">
                          <i class="mr-2 fa fa-bug"></i> bug</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/building">
                          <i class="mr-2 fa fa-building"></i> building</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/building-o">
                          <i class="mr-2 fa fa-building-o"></i> building-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bullhorn">
                          <i class="mr-2 fa fa-bullhorn"></i> bullhorn</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bullseye">
                          <i class="mr-2 fa fa-bullseye"></i> bullseye</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bus">
                          <i class="mr-2 fa fa-bus"></i> bus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/taxi">
                          <i class="mr-2 fa fa-cab"></i> cab </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calculator">
                          <i class="mr-2 fa fa-calculator"></i> calculator</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar">
                          <i class="mr-2 fa fa-calendar"></i> calendar</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar-check-o">
                          <i class="mr-2 fa fa-calendar-check-o"></i> calendar-check-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar-minus-o">
                          <i class="mr-2 fa fa-calendar-minus-o"></i> calendar-minus-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar-o">
                          <i class="mr-2 fa fa-calendar-o"></i> calendar-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar-plus-o">
                          <i class="mr-2 fa fa-calendar-plus-o"></i> calendar-plus-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/calendar-times-o">
                          <i class="mr-2 fa fa-calendar-times-o"></i> calendar-times-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/camera">
                          <i class="mr-2 fa fa-camera"></i> camera</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/camera-retro">
                          <i class="mr-2 fa fa-camera-retro"></i> camera-retro</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/car">
                          <i class="mr-2 fa fa-car"></i> car</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-down">
                          <i class="mr-2 fa fa-caret-square-o-down"></i> caret-square-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-left">
                          <i class="mr-2 fa fa-caret-square-o-left"></i> caret-square-o-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-right">
                          <i class="mr-2 fa fa-caret-square-o-right"></i> caret-square-o-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-up">
                          <i class="mr-2 fa fa-caret-square-o-up"></i> caret-square-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cart-arrow-down">
                          <i class="mr-2 fa fa-cart-arrow-down"></i> cart-arrow-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cart-plus">
                          <i class="mr-2 fa fa-cart-plus"></i> cart-plus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc">
                          <i class="mr-2 fa fa-cc"></i> cc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/certificate">
                          <i class="mr-2 fa fa-certificate"></i> certificate</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check">
                          <i class="mr-2 fa fa-check"></i> check</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-circle">
                          <i class="mr-2 fa fa-check-circle"></i> check-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-circle-o">
                          <i class="mr-2 fa fa-check-circle-o"></i> check-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-square">
                          <i class="mr-2 fa fa-check-square"></i> check-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-square-o">
                          <i class="mr-2 fa fa-check-square-o"></i> check-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/child">
                          <i class="mr-2 fa fa-child"></i> child</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle">
                          <i class="mr-2 fa fa-circle"></i> circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle-o">
                          <i class="mr-2 fa fa-circle-o"></i> circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle-o-notch">
                          <i class="mr-2 fa fa-circle-o-notch"></i> circle-o-notch</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle-thin">
                          <i class="mr-2 fa fa-circle-thin"></i> circle-thin</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/clock-o">
                          <i class="mr-2 fa fa-clock-o"></i> clock-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/clone">
                          <i class="mr-2 fa fa-clone"></i> clone</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/times">
                          <i class="mr-2 fa fa-close"></i> close </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cloud">
                          <i class="mr-2 fa fa-cloud"></i> cloud</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cloud-download">
                          <i class="mr-2 fa fa-cloud-download"></i> cloud-download</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cloud-upload">
                          <i class="mr-2 fa fa-cloud-upload"></i> cloud-upload</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/code">
                          <i class="mr-2 fa fa-code"></i> code</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/code-fork">
                          <i class="mr-2 fa fa-code-fork"></i> code-fork</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/coffee">
                          <i class="mr-2 fa fa-coffee"></i> coffee</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cog">
                          <i class="mr-2 fa fa-cog"></i> cog</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cogs">
                          <i class="mr-2 fa fa-cogs"></i> cogs</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/comment">
                          <i class="mr-2 fa fa-comment"></i> comment</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/comment-o">
                          <i class="mr-2 fa fa-comment-o"></i> comment-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/commenting">
                          <i class="mr-2 fa fa-commenting"></i> commenting</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/commenting-o">
                          <i class="mr-2 fa fa-commenting-o"></i> commenting-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/comments">
                          <i class="mr-2 fa fa-comments"></i> comments</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/comments-o">
                          <i class="mr-2 fa fa-comments-o"></i> comments-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/compass">
                          <i class="mr-2 fa fa-compass"></i> compass</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/copyright">
                          <i class="mr-2 fa fa-copyright"></i> copyright</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/creative-commons">
                          <i class="mr-2 fa fa-creative-commons"></i> creative-commons</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/credit-card">
                          <i class="mr-2 fa fa-credit-card"></i> credit-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/credit-card-alt">
                          <i class="mr-2 fa fa-credit-card-alt"></i> credit-card-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/crop">
                          <i class="mr-2 fa fa-crop"></i> crop</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/crosshairs">
                          <i class="mr-2 fa fa-crosshairs"></i> crosshairs</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cube">
                          <i class="mr-2 fa fa-cube"></i> cube</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cubes">
                          <i class="mr-2 fa fa-cubes"></i> cubes</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cutlery">
                          <i class="mr-2 fa fa-cutlery"></i> cutlery</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tachometer">
                          <i class="mr-2 fa fa-dashboard"></i> dashboard </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/database">
                          <i class="mr-2 fa fa-database"></i> database</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-deaf"></i> deaf</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-deafness"></i> deafness </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/desktop">
                          <i class="mr-2 fa fa-desktop"></i> desktop</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/diamond">
                          <i class="mr-2 fa fa-diamond"></i> diamond</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/dot-circle-o">
                          <i class="mr-2 fa fa-dot-circle-o"></i> dot-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/download">
                          <i class="mr-2 fa fa-download"></i> download</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card">
                          <i class="mr-2 fa fa-drivers-license"></i> drivers-license </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card-o">
                          <i class="mr-2 fa fa-drivers-license-o"></i> drivers-license-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pencil-square-o">
                          <i class="mr-2 fa fa-edit"></i> edit </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ellipsis-h">
                          <i class="mr-2 fa fa-ellipsis-h"></i> ellipsis-h</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ellipsis-v">
                          <i class="mr-2 fa fa-ellipsis-v"></i> ellipsis-v</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope">
                          <i class="mr-2 fa fa-envelope"></i> envelope</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-o">
                          <i class="mr-2 fa fa-envelope-o"></i> envelope-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-open">
                          <i class="mr-2 fa fa-envelope-open"></i> envelope-open</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-open-o">
                          <i class="mr-2 fa fa-envelope-open-o"></i> envelope-open-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envelope-square">
                          <i class="mr-2 fa fa-envelope-square"></i> envelope-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eraser">
                          <i class="mr-2 fa fa-eraser"></i> eraser</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exchange">
                          <i class="mr-2 fa fa-exchange"></i> exchange</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exclamation">
                          <i class="mr-2 fa fa-exclamation"></i> exclamation</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exclamation-circle">
                          <i class="mr-2 fa fa-exclamation-circle"></i> exclamation-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exclamation-triangle">
                          <i class="mr-2 fa fa-exclamation-triangle"></i> exclamation-triangle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/external-link">
                          <i class="mr-2 fa fa-external-link"></i> external-link</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/external-link-square">
                          <i class="mr-2 fa fa-external-link-square"></i> external-link-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eye">
                          <i class="mr-2 fa fa-eye"></i> eye</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eye-slash">
                          <i class="mr-2 fa fa-eye-slash"></i> eye-slash</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eyedropper">
                          <i class="mr-2 fa fa-eyedropper"></i> eyedropper</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fax">
                          <i class="mr-2 fa fa-fax"></i> fax</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rss">
                          <i class="mr-2 fa fa-feed"></i> feed </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/female">
                          <i class="mr-2 fa fa-female"></i> female</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fighter-jet">
                          <i class="mr-2 fa fa-fighter-jet"></i> fighter-jet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-archive-o">
                          <i class="mr-2 fa fa-file-archive-o"></i> file-archive-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-audio-o">
                          <i class="mr-2 fa fa-file-audio-o"></i> file-audio-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-code-o">
                          <i class="mr-2 fa fa-file-code-o"></i> file-code-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-excel-o">
                          <i class="mr-2 fa fa-file-excel-o"></i> file-excel-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-image-o"></i> file-image-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-video-o">
                          <i class="mr-2 fa fa-file-movie-o"></i> file-movie-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-pdf-o">
                          <i class="mr-2 fa fa-file-pdf-o"></i> file-pdf-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-photo-o"></i> file-photo-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-picture-o"></i> file-picture-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-powerpoint-o">
                          <i class="mr-2 fa fa-file-powerpoint-o"></i> file-powerpoint-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-audio-o">
                          <i class="mr-2 fa fa-file-sound-o"></i> file-sound-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-video-o">
                          <i class="mr-2 fa fa-file-video-o"></i> file-video-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-word-o">
                          <i class="mr-2 fa fa-file-word-o"></i> file-word-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-archive-o">
                          <i class="mr-2 fa fa-file-zip-o"></i> file-zip-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/film">
                          <i class="mr-2 fa fa-film"></i> film</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/filter">
                          <i class="mr-2 fa fa-filter"></i> filter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fire">
                          <i class="mr-2 fa fa-fire"></i> fire</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fire-extinguisher">
                          <i class="mr-2 fa fa-fire-extinguisher"></i> fire-extinguisher</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/flag">
                          <i class="mr-2 fa fa-flag"></i> flag</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/flag-checkered">
                          <i class="mr-2 fa fa-flag-checkered"></i> flag-checkered</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/flag-o">
                          <i class="mr-2 fa fa-flag-o"></i> flag-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bolt">
                          <i class="mr-2 fa fa-flash"></i> flash </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/flask">
                          <i class="mr-2 fa fa-flask"></i> flask</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/folder">
                          <i class="mr-2 fa fa-folder"></i> folder</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/folder-o">
                          <i class="mr-2 fa fa-folder-o"></i> folder-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/folder-open">
                          <i class="mr-2 fa fa-folder-open"></i> folder-open</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/folder-open-o">
                          <i class="mr-2 fa fa-folder-open-o"></i> folder-open-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/frown-o">
                          <i class="mr-2 fa fa-frown-o"></i> frown-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/futbol-o">
                          <i class="mr-2 fa fa-futbol-o"></i> futbol-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gamepad">
                          <i class="mr-2 fa fa-gamepad"></i> gamepad</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gavel">
                          <i class="mr-2 fa fa-gavel"></i> gavel</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cog">
                          <i class="mr-2 fa fa-gear"></i> gear </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cogs">
                          <i class="mr-2 fa fa-gears"></i> gears </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gift">
                          <i class="mr-2 fa fa-gift"></i> gift</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/glass">
                          <i class="mr-2 fa fa-glass"></i> glass</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/globe">
                          <i class="mr-2 fa fa-globe"></i> globe</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/graduation-cap">
                          <i class="mr-2 fa fa-graduation-cap"></i> graduation-cap</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/users">
                          <i class="mr-2 fa fa-group"></i> group </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-rock-o">
                          <i class="mr-2 fa fa-hand-grab-o"></i> hand-grab-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-lizard-o">
                          <i class="mr-2 fa fa-hand-lizard-o"></i> hand-lizard-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-paper-o">
                          <i class="mr-2 fa fa-hand-paper-o"></i> hand-paper-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-peace-o">
                          <i class="mr-2 fa fa-hand-peace-o"></i> hand-peace-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-pointer-o">
                          <i class="mr-2 fa fa-hand-pointer-o"></i> hand-pointer-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-rock-o">
                          <i class="mr-2 fa fa-hand-rock-o"></i> hand-rock-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-scissors-o">
                          <i class="mr-2 fa fa-hand-scissors-o"></i> hand-scissors-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-spock-o">
                          <i class="mr-2 fa fa-hand-spock-o"></i> hand-spock-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-paper-o">
                          <i class="mr-2 fa fa-hand-stop-o"></i> hand-stop-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/handshake-o">
                          <i class="mr-2 fa fa-handshake-o"></i> handshake-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-hard-of-hearing"></i> hard-of-hearing </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hashtag">
                          <i class="mr-2 fa fa-hashtag"></i> hashtag</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hdd-o">
                          <i class="mr-2 fa fa-hdd-o"></i> hdd-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/headphones">
                          <i class="mr-2 fa fa-headphones"></i> headphones</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heart">
                          <i class="mr-2 fa fa-heart"></i> heart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heart-o">
                          <i class="mr-2 fa fa-heart-o"></i> heart-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heartbeat">
                          <i class="mr-2 fa fa-heartbeat"></i> heartbeat</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/history">
                          <i class="mr-2 fa fa-history"></i> history</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/home">
                          <i class="mr-2 fa fa-home"></i> home</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bed">
                          <i class="mr-2 fa fa-hotel"></i> hotel </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass">
                          <i class="mr-2 fa fa-hourglass"></i> hourglass</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-start">
                          <i class="mr-2 fa fa-hourglass-1"></i> hourglass-1 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-half">
                          <i class="mr-2 fa fa-hourglass-2"></i> hourglass-2 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-end">
                          <i class="mr-2 fa fa-hourglass-3"></i> hourglass-3 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-end">
                          <i class="mr-2 fa fa-hourglass-end"></i> hourglass-end</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-half">
                          <i class="mr-2 fa fa-hourglass-half"></i> hourglass-half</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-o">
                          <i class="mr-2 fa fa-hourglass-o"></i> hourglass-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hourglass-start">
                          <i class="mr-2 fa fa-hourglass-start"></i> hourglass-start</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/i-cursor">
                          <i class="mr-2 fa fa-i-cursor"></i> i-cursor</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-badge">
                          <i class="mr-2 fa fa-id-badge"></i> id-badge</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card">
                          <i class="mr-2 fa fa-id-card"></i> id-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/id-card-o">
                          <i class="mr-2 fa fa-id-card-o"></i> id-card-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/picture-o">
                          <i class="mr-2 fa fa-image"></i> image </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/inbox">
                          <i class="mr-2 fa fa-inbox"></i> inbox</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/industry">
                          <i class="mr-2 fa fa-industry"></i> industry</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/info">
                          <i class="mr-2 fa fa-info"></i> info</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/info-circle">
                          <i class="mr-2 fa fa-info-circle"></i> info-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/university">
                          <i class="mr-2 fa fa-institution"></i> institution </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/key">
                          <i class="mr-2 fa fa-key"></i> key</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/keyboard-o">
                          <i class="mr-2 fa fa-keyboard-o"></i> keyboard-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/language">
                          <i class="mr-2 fa fa-language"></i> language</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/laptop">
                          <i class="mr-2 fa fa-laptop"></i> laptop</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/leaf">
                          <i class="mr-2 fa fa-leaf"></i> leaf</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gavel">
                          <i class="mr-2 fa fa-legal"></i> legal </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/lemon-o">
                          <i class="mr-2 fa fa-lemon-o"></i> lemon-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/level-down">
                          <i class="mr-2 fa fa-level-down"></i> level-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/level-up">
                          <i class="mr-2 fa fa-level-up"></i> level-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/life-ring">
                          <i class="mr-2 fa fa-life-bouy"></i> life-bouy </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/life-ring">
                          <i class="mr-2 fa fa-life-buoy"></i> life-buoy </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/life-ring">
                          <i class="mr-2 fa fa-life-ring"></i> life-ring</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/life-ring">
                          <i class="mr-2 fa fa-life-saver"></i> life-saver </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/lightbulb-o">
                          <i class="mr-2 fa fa-lightbulb-o"></i> lightbulb-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/line-chart">
                          <i class="mr-2 fa fa-line-chart"></i> line-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/location-arrow">
                          <i class="mr-2 fa fa-location-arrow"></i> location-arrow</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/lock">
                          <i class="mr-2 fa fa-lock"></i> lock</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/low-vision">
                          <i class="mr-2 fa fa-low-vision"></i> low-vision</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/magic">
                          <i class="mr-2 fa fa-magic"></i> magic</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/magnet">
                          <i class="mr-2 fa fa-magnet"></i> magnet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share">
                          <i class="mr-2 fa fa-mail-forward"></i> mail-forward </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reply">
                          <i class="mr-2 fa fa-mail-reply"></i> mail-reply </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reply-all">
                          <i class="mr-2 fa fa-mail-reply-all"></i> mail-reply-all </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/male">
                          <i class="mr-2 fa fa-male"></i> male</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/map">
                          <i class="mr-2 fa fa-map"></i> map</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/map-marker">
                          <i class="mr-2 fa fa-map-marker"></i> map-marker</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/map-o">
                          <i class="mr-2 fa fa-map-o"></i> map-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/map-pin">
                          <i class="mr-2 fa fa-map-pin"></i> map-pin</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/map-signs">
                          <i class="mr-2 fa fa-map-signs"></i> map-signs</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/meh-o">
                          <i class="mr-2 fa fa-meh-o"></i> meh-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/microchip">
                          <i class="mr-2 fa fa-microchip"></i> microchip</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/microphone">
                          <i class="mr-2 fa fa-microphone"></i> microphone</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/microphone-slash">
                          <i class="mr-2 fa fa-microphone-slash"></i> microphone-slash</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus">
                          <i class="mr-2 fa fa-minus"></i> minus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus-circle">
                          <i class="mr-2 fa fa-minus-circle"></i> minus-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus-square">
                          <i class="mr-2 fa fa-minus-square"></i> minus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus-square-o">
                          <i class="mr-2 fa fa-minus-square-o"></i> minus-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mobile">
                          <i class="mr-2 fa fa-mobile"></i> mobile</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mobile">
                          <i class="mr-2 fa fa-mobile-phone"></i> mobile-phone </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/money">
                          <i class="mr-2 fa fa-money"></i> money</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/moon-o">
                          <i class="mr-2 fa fa-moon-o"></i> moon-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/graduation-cap">
                          <i class="mr-2 fa fa-mortar-board"></i> mortar-board </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/motorcycle">
                          <i class="mr-2 fa fa-motorcycle"></i> motorcycle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mouse-pointer">
                          <i class="mr-2 fa fa-mouse-pointer"></i> mouse-pointer</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/music">
                          <i class="mr-2 fa fa-music"></i> music</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bars">
                          <i class="mr-2 fa fa-navicon"></i> navicon </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/newspaper-o">
                          <i class="mr-2 fa fa-newspaper-o"></i> newspaper-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/object-group">
                          <i class="mr-2 fa fa-object-group"></i> object-group</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/object-ungroup">
                          <i class="mr-2 fa fa-object-ungroup"></i> object-ungroup</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paint-brush">
                          <i class="mr-2 fa fa-paint-brush"></i> paint-brush</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paper-plane">
                          <i class="mr-2 fa fa-paper-plane"></i> paper-plane</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paper-plane-o">
                          <i class="mr-2 fa fa-paper-plane-o"></i> paper-plane-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paw">
                          <i class="mr-2 fa fa-paw"></i> paw</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pencil">
                          <i class="mr-2 fa fa-pencil"></i> pencil</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pencil-square">
                          <i class="mr-2 fa fa-pencil-square"></i> pencil-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pencil-square-o">
                          <i class="mr-2 fa fa-pencil-square-o"></i> pencil-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/percent">
                          <i class="mr-2 fa fa-percent"></i> percent</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/phone">
                          <i class="mr-2 fa fa-phone"></i> phone</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/phone-square">
                          <i class="mr-2 fa fa-phone-square"></i> phone-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/picture-o">
                          <i class="mr-2 fa fa-photo"></i> photo </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/picture-o">
                          <i class="mr-2 fa fa-picture-o"></i> picture-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pie-chart">
                          <i class="mr-2 fa fa-pie-chart"></i> pie-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plane">
                          <i class="mr-2 fa fa-plane"></i> plane</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plug">
                          <i class="mr-2 fa fa-plug"></i> plug</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus">
                          <i class="mr-2 fa fa-plus"></i> plus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-circle">
                          <i class="mr-2 fa fa-plus-circle"></i> plus-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-square">
                          <i class="mr-2 fa fa-plus-square"></i> plus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-square-o">
                          <i class="mr-2 fa fa-plus-square-o"></i> plus-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/podcast">
                          <i class="mr-2 fa fa-podcast"></i> podcast</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/power-off">
                          <i class="mr-2 fa fa-power-off"></i> power-off</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/print">
                          <i class="mr-2 fa fa-print"></i> print</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/puzzle-piece">
                          <i class="mr-2 fa fa-puzzle-piece"></i> puzzle-piece</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/qrcode">
                          <i class="mr-2 fa fa-qrcode"></i> qrcode</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/question">
                          <i class="mr-2 fa fa-question"></i> question</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/question-circle">
                          <i class="mr-2 fa fa-question-circle"></i> question-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/question-circle-o">
                          <i class="mr-2 fa fa-question-circle-o"></i> question-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/quote-left">
                          <i class="mr-2 fa fa-quote-left"></i> quote-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/quote-right">
                          <i class="mr-2 fa fa-quote-right"></i> quote-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/random">
                          <i class="mr-2 fa fa-random"></i> random</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/recycle">
                          <i class="mr-2 fa fa-recycle"></i> recycle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/refresh">
                          <i class="mr-2 fa fa-refresh"></i> refresh</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/registered">
                          <i class="mr-2 fa fa-registered"></i> registered</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/times">
                          <i class="mr-2 fa fa-remove"></i> remove </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bars">
                          <i class="mr-2 fa fa-reorder"></i> reorder </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reply">
                          <i class="mr-2 fa fa-reply"></i> reply</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reply-all">
                          <i class="mr-2 fa fa-reply-all"></i> reply-all</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/retweet">
                          <i class="mr-2 fa fa-retweet"></i> retweet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/road">
                          <i class="mr-2 fa fa-road"></i> road</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rocket">
                          <i class="mr-2 fa fa-rocket"></i> rocket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rss">
                          <i class="mr-2 fa fa-rss"></i> rss</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rss-square">
                          <i class="mr-2 fa fa-rss-square"></i> rss-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bath">
                          <i class="mr-2 fa fa-s15"></i> s15 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/search">
                          <i class="mr-2 fa fa-search"></i> search</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/search-minus">
                          <i class="mr-2 fa fa-search-minus"></i> search-minus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/search-plus">
                          <i class="mr-2 fa fa-search-plus"></i> search-plus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paper-plane">
                          <i class="mr-2 fa fa-send"></i> send </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paper-plane-o">
                          <i class="mr-2 fa fa-send-o"></i> send-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/server">
                          <i class="mr-2 fa fa-server"></i> server</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share">
                          <i class="mr-2 fa fa-share"></i> share</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-alt">
                          <i class="mr-2 fa fa-share-alt"></i> share-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-alt-square">
                          <i class="mr-2 fa fa-share-alt-square"></i> share-alt-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-square">
                          <i class="mr-2 fa fa-share-square"></i> share-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-square-o">
                          <i class="mr-2 fa fa-share-square-o"></i> share-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shield">
                          <i class="mr-2 fa fa-shield"></i> shield</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ship">
                          <i class="mr-2 fa fa-ship"></i> ship</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shopping-bag">
                          <i class="mr-2 fa fa-shopping-bag"></i> shopping-bag</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shopping-basket">
                          <i class="mr-2 fa fa-shopping-basket"></i> shopping-basket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shopping-cart">
                          <i class="mr-2 fa fa-shopping-cart"></i> shopping-cart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shower">
                          <i class="mr-2 fa fa-shower"></i> shower</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-in">
                          <i class="mr-2 fa fa-sign-in"></i> sign-in</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-language">
                          <i class="mr-2 fa fa-sign-language"></i> sign-language</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-out">
                          <i class="mr-2 fa fa-sign-out"></i> sign-out</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/signal">
                          <i class="mr-2 fa fa-signal"></i> signal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-language">
                          <i class="mr-2 fa fa-signing"></i> signing </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sitemap">
                          <i class="mr-2 fa fa-sitemap"></i> sitemap</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sliders">
                          <i class="mr-2 fa fa-sliders"></i> sliders</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/smile-o">
                          <i class="mr-2 fa fa-smile-o"></i> smile-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/snowflake-o">
                          <i class="mr-2 fa fa-snowflake-o"></i> snowflake-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/futbol-o">
                          <i class="mr-2 fa fa-soccer-ball-o"></i> soccer-ball-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort">
                          <i class="mr-2 fa fa-sort"></i> sort</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-alpha-asc">
                          <i class="mr-2 fa fa-sort-alpha-asc"></i> sort-alpha-asc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-alpha-desc">
                          <i class="mr-2 fa fa-sort-alpha-desc"></i> sort-alpha-desc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-amount-asc">
                          <i class="mr-2 fa fa-sort-amount-asc"></i> sort-amount-asc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-amount-desc">
                          <i class="mr-2 fa fa-sort-amount-desc"></i> sort-amount-desc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-asc">
                          <i class="mr-2 fa fa-sort-asc"></i> sort-asc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-desc">
                          <i class="mr-2 fa fa-sort-desc"></i> sort-desc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-desc">
                          <i class="mr-2 fa fa-sort-down"></i> sort-down </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-numeric-asc">
                          <i class="mr-2 fa fa-sort-numeric-asc"></i> sort-numeric-asc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-numeric-desc">
                          <i class="mr-2 fa fa-sort-numeric-desc"></i> sort-numeric-desc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort-asc">
                          <i class="mr-2 fa fa-sort-up"></i> sort-up </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/space-shuttle">
                          <i class="mr-2 fa fa-space-shuttle"></i> space-shuttle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/spinner">
                          <i class="mr-2 fa fa-spinner"></i> spinner</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/spoon">
                          <i class="mr-2 fa fa-spoon"></i> spoon</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/square">
                          <i class="mr-2 fa fa-square"></i> square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/square-o">
                          <i class="mr-2 fa fa-square-o"></i> square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star">
                          <i class="mr-2 fa fa-star"></i> star</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star-half">
                          <i class="mr-2 fa fa-star-half"></i> star-half</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star-half-o">
                          <i class="mr-2 fa fa-star-half-empty"></i> star-half-empty </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star-half-o">
                          <i class="mr-2 fa fa-star-half-full"></i> star-half-full </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star-half-o">
                          <i class="mr-2 fa fa-star-half-o"></i> star-half-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/star-o">
                          <i class="mr-2 fa fa-star-o"></i> star-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sticky-note">
                          <i class="mr-2 fa fa-sticky-note"></i> sticky-note</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sticky-note-o">
                          <i class="mr-2 fa fa-sticky-note-o"></i> sticky-note-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/street-view">
                          <i class="mr-2 fa fa-street-view"></i> street-view</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/suitcase">
                          <i class="mr-2 fa fa-suitcase"></i> suitcase</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sun-o">
                          <i class="mr-2 fa fa-sun-o"></i> sun-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/life-ring">
                          <i class="mr-2 fa fa-support"></i> support </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tablet">
                          <i class="mr-2 fa fa-tablet"></i> tablet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tachometer">
                          <i class="mr-2 fa fa-tachometer"></i> tachometer</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tag">
                          <i class="mr-2 fa fa-tag"></i> tag</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tags">
                          <i class="mr-2 fa fa-tags"></i> tags</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tasks">
                          <i class="mr-2 fa fa-tasks"></i> tasks</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/taxi">
                          <i class="mr-2 fa fa-taxi"></i> taxi</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/television">
                          <i class="mr-2 fa fa-television"></i> television</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/terminal">
                          <i class="mr-2 fa fa-terminal"></i> terminal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer"></i> thermometer </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-empty">
                          <i class="mr-2 fa fa-thermometer-0"></i> thermometer-0 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-quarter">
                          <i class="mr-2 fa fa-thermometer-1"></i> thermometer-1 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-half">
                          <i class="mr-2 fa fa-thermometer-2"></i> thermometer-2 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-three-quarters">
                          <i class="mr-2 fa fa-thermometer-3"></i> thermometer-3 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer-4"></i> thermometer-4 </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-empty">
                          <i class="mr-2 fa fa-thermometer-empty"></i> thermometer-empty</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-full">
                          <i class="mr-2 fa fa-thermometer-full"></i> thermometer-full</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-half">
                          <i class="mr-2 fa fa-thermometer-half"></i> thermometer-half</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-quarter">
                          <i class="mr-2 fa fa-thermometer-quarter"></i> thermometer-quarter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thermometer-three-quarters">
                          <i class="mr-2 fa fa-thermometer-three-quarters"></i> thermometer-three-quarters</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumb-tack">
                          <i class="mr-2 fa fa-thumb-tack"></i> thumb-tack</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-down">
                          <i class="mr-2 fa fa-thumbs-down"></i> thumbs-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-o-down">
                          <i class="mr-2 fa fa-thumbs-o-down"></i> thumbs-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-o-up">
                          <i class="mr-2 fa fa-thumbs-o-up"></i> thumbs-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-up">
                          <i class="mr-2 fa fa-thumbs-up"></i> thumbs-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ticket">
                          <i class="mr-2 fa fa-ticket"></i> ticket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/times">
                          <i class="mr-2 fa fa-times"></i> times</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/times-circle">
                          <i class="mr-2 fa fa-times-circle"></i> times-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/times-circle-o">
                          <i class="mr-2 fa fa-times-circle-o"></i> times-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close">
                          <i class="mr-2 fa fa-times-rectangle"></i> times-rectangle </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close-o">
                          <i class="mr-2 fa fa-times-rectangle-o"></i> times-rectangle-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tint">
                          <i class="mr-2 fa fa-tint"></i> tint</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-down">
                          <i class="mr-2 fa fa-toggle-down"></i> toggle-down </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-left">
                          <i class="mr-2 fa fa-toggle-left"></i> toggle-left </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/toggle-off">
                          <i class="mr-2 fa fa-toggle-off"></i> toggle-off</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/toggle-on">
                          <i class="mr-2 fa fa-toggle-on"></i> toggle-on</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-right">
                          <i class="mr-2 fa fa-toggle-right"></i> toggle-right </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-up">
                          <i class="mr-2 fa fa-toggle-up"></i> toggle-up </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/trademark">
                          <i class="mr-2 fa fa-trademark"></i> trademark</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/trash">
                          <i class="mr-2 fa fa-trash"></i> trash</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/trash-o">
                          <i class="mr-2 fa fa-trash-o"></i> trash-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tree">
                          <i class="mr-2 fa fa-tree"></i> tree</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/trophy">
                          <i class="mr-2 fa fa-trophy"></i> trophy</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/truck">
                          <i class="mr-2 fa fa-truck"></i> truck</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tty">
                          <i class="mr-2 fa fa-tty"></i> tty</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/television">
                          <i class="mr-2 fa fa-tv"></i> tv </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/umbrella">
                          <i class="mr-2 fa fa-umbrella"></i> umbrella</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/universal-access">
                          <i class="mr-2 fa fa-universal-access"></i> universal-access</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/university">
                          <i class="mr-2 fa fa-university"></i> university</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/unlock">
                          <i class="mr-2 fa fa-unlock"></i> unlock</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/unlock-alt">
                          <i class="mr-2 fa fa-unlock-alt"></i> unlock-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sort">
                          <i class="mr-2 fa fa-unsorted"></i> unsorted </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/upload">
                          <i class="mr-2 fa fa-upload"></i> upload</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user">
                          <i class="mr-2 fa fa-user"></i> user</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-circle">
                          <i class="mr-2 fa fa-user-circle"></i> user-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-circle-o">
                          <i class="mr-2 fa fa-user-circle-o"></i> user-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-o">
                          <i class="mr-2 fa fa-user-o"></i> user-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-plus">
                          <i class="mr-2 fa fa-user-plus"></i> user-plus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-secret">
                          <i class="mr-2 fa fa-user-secret"></i> user-secret</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-times">
                          <i class="mr-2 fa fa-user-times"></i> user-times</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/users">
                          <i class="mr-2 fa fa-users"></i> users</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card">
                          <i class="mr-2 fa fa-vcard"></i> vcard </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/address-card-o">
                          <i class="mr-2 fa fa-vcard-o"></i> vcard-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/video-camera">
                          <i class="mr-2 fa fa-video-camera"></i> video-camera</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/volume-control-phone">
                          <i class="mr-2 fa fa-volume-control-phone"></i> volume-control-phone</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/volume-down">
                          <i class="mr-2 fa fa-volume-down"></i> volume-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/volume-off">
                          <i class="mr-2 fa fa-volume-off"></i> volume-off</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/volume-up">
                          <i class="mr-2 fa fa-volume-up"></i> volume-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exclamation-triangle">
                          <i class="mr-2 fa fa-warning"></i> warning </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair">
                          <i class="mr-2 fa fa-wheelchair"></i> wheelchair</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair-alt">
                          <i class="mr-2 fa fa-wheelchair-alt"></i> wheelchair-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wifi">
                          <i class="mr-2 fa fa-wifi"></i> wifi</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close">
                          <i class="mr-2 fa fa-window-close"></i> window-close</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-close-o">
                          <i class="mr-2 fa fa-window-close-o"></i> window-close-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-maximize">
                          <i class="mr-2 fa fa-window-maximize"></i> window-maximize</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-minimize">
                          <i class="mr-2 fa fa-window-minimize"></i> window-minimize</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/window-restore">
                          <i class="mr-2 fa fa-window-restore"></i> window-restore</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wrench">
                          <i class="mr-2 fa fa-wrench"></i> wrench</a>
                      </div>
                    </div>
                  </section>
                  <section id="accessibility">
                    <h2 class="color-primary mt-4 mb-2">Accessibility Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/american-sign-language-interpreting">
                          <i class="mr-2 fa fa-american-sign-language-interpreting"></i> american-sign-language-interpreting</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/american-sign-language-interpreting">
                          <i class="mr-2 fa fa-asl-interpreting"></i> asl-interpreting </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/assistive-listening-systems">
                          <i class="mr-2 fa fa-assistive-listening-systems"></i> assistive-listening-systems</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/audio-description">
                          <i class="mr-2 fa fa-audio-description"></i> audio-description</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/blind">
                          <i class="mr-2 fa fa-blind"></i> blind</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/braille">
                          <i class="mr-2 fa fa-braille"></i> braille</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc">
                          <i class="mr-2 fa fa-cc"></i> cc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-deaf"></i> deaf</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-deafness"></i> deafness </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deaf">
                          <i class="mr-2 fa fa-hard-of-hearing"></i> hard-of-hearing </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/low-vision">
                          <i class="mr-2 fa fa-low-vision"></i> low-vision</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/question-circle-o">
                          <i class="mr-2 fa fa-question-circle-o"></i> question-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-language">
                          <i class="mr-2 fa fa-sign-language"></i> sign-language</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sign-language">
                          <i class="mr-2 fa fa-signing"></i> signing </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tty">
                          <i class="mr-2 fa fa-tty"></i> tty</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/universal-access">
                          <i class="mr-2 fa fa-universal-access"></i> universal-access</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/volume-control-phone">
                          <i class="mr-2 fa fa-volume-control-phone"></i> volume-control-phone</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair">
                          <i class="mr-2 fa fa-wheelchair"></i> wheelchair</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair-alt">
                          <i class="mr-2 fa fa-wheelchair-alt"></i> wheelchair-alt</a>
                      </div>
                    </div>
                  </section>
                  <section id="hand">
                    <h2 class="color-primary mt-4 mb-2">Hand Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-rock-o">
                          <i class="mr-2 fa fa-hand-grab-o"></i> hand-grab-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-lizard-o">
                          <i class="mr-2 fa fa-hand-lizard-o"></i> hand-lizard-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-down">
                          <i class="mr-2 fa fa-hand-o-down"></i> hand-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-left">
                          <i class="mr-2 fa fa-hand-o-left"></i> hand-o-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-right">
                          <i class="mr-2 fa fa-hand-o-right"></i> hand-o-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-up">
                          <i class="mr-2 fa fa-hand-o-up"></i> hand-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-paper-o">
                          <i class="mr-2 fa fa-hand-paper-o"></i> hand-paper-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-peace-o">
                          <i class="mr-2 fa fa-hand-peace-o"></i> hand-peace-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-pointer-o">
                          <i class="mr-2 fa fa-hand-pointer-o"></i> hand-pointer-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-rock-o">
                          <i class="mr-2 fa fa-hand-rock-o"></i> hand-rock-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-scissors-o">
                          <i class="mr-2 fa fa-hand-scissors-o"></i> hand-scissors-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-spock-o">
                          <i class="mr-2 fa fa-hand-spock-o"></i> hand-spock-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-paper-o">
                          <i class="mr-2 fa fa-hand-stop-o"></i> hand-stop-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-down">
                          <i class="mr-2 fa fa-thumbs-down"></i> thumbs-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-o-down">
                          <i class="mr-2 fa fa-thumbs-o-down"></i> thumbs-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-o-up">
                          <i class="mr-2 fa fa-thumbs-o-up"></i> thumbs-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/thumbs-up">
                          <i class="mr-2 fa fa-thumbs-up"></i> thumbs-up</a>
                      </div>
                    </div>
                  </section>
                  <section id="transportation">
                    <h2 class="color-primary mt-4 mb-2">Transportation Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ambulance">
                          <i class="mr-2 fa fa-ambulance"></i> ambulance</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/car">
                          <i class="mr-2 fa fa-automobile"></i> automobile </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bicycle">
                          <i class="mr-2 fa fa-bicycle"></i> bicycle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bus">
                          <i class="mr-2 fa fa-bus"></i> bus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/taxi">
                          <i class="mr-2 fa fa-cab"></i> cab </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/car">
                          <i class="mr-2 fa fa-car"></i> car</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fighter-jet">
                          <i class="mr-2 fa fa-fighter-jet"></i> fighter-jet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/motorcycle">
                          <i class="mr-2 fa fa-motorcycle"></i> motorcycle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plane">
                          <i class="mr-2 fa fa-plane"></i> plane</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rocket">
                          <i class="mr-2 fa fa-rocket"></i> rocket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ship">
                          <i class="mr-2 fa fa-ship"></i> ship</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/space-shuttle">
                          <i class="mr-2 fa fa-space-shuttle"></i> space-shuttle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/subway">
                          <i class="mr-2 fa fa-subway"></i> subway</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/taxi">
                          <i class="mr-2 fa fa-taxi"></i> taxi</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/train">
                          <i class="mr-2 fa fa-train"></i> train</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/truck">
                          <i class="mr-2 fa fa-truck"></i> truck</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair">
                          <i class="mr-2 fa fa-wheelchair"></i> wheelchair</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair-alt">
                          <i class="mr-2 fa fa-wheelchair-alt"></i> wheelchair-alt</a>
                      </div>
                    </div>
                  </section>
                  <section id="gender">
                    <h2 class="color-primary mt-4 mb-2">Gender Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/genderless">
                          <i class="mr-2 fa fa-genderless"></i> genderless</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/transgender">
                          <i class="mr-2 fa fa-intersex"></i> intersex </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mars">
                          <i class="mr-2 fa fa-mars"></i> mars</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mars-double">
                          <i class="mr-2 fa fa-mars-double"></i> mars-double</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mars-stroke">
                          <i class="mr-2 fa fa-mars-stroke"></i> mars-stroke</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mars-stroke-h">
                          <i class="mr-2 fa fa-mars-stroke-h"></i> mars-stroke-h</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mars-stroke-v">
                          <i class="mr-2 fa fa-mars-stroke-v"></i> mars-stroke-v</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mercury">
                          <i class="mr-2 fa fa-mercury"></i> mercury</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/neuter">
                          <i class="mr-2 fa fa-neuter"></i> neuter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/transgender">
                          <i class="mr-2 fa fa-transgender"></i> transgender</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/transgender-alt">
                          <i class="mr-2 fa fa-transgender-alt"></i> transgender-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/venus">
                          <i class="mr-2 fa fa-venus"></i> venus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/venus-double">
                          <i class="mr-2 fa fa-venus-double"></i> venus-double</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/venus-mars">
                          <i class="mr-2 fa fa-venus-mars"></i> venus-mars</a>
                      </div>
                    </div>
                  </section>
                  <section id="file-type">
                    <h2 class="color-primary mt-4 mb-2">File Type Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file">
                          <i class="mr-2 fa fa-file"></i> file</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-archive-o">
                          <i class="mr-2 fa fa-file-archive-o"></i> file-archive-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-audio-o">
                          <i class="mr-2 fa fa-file-audio-o"></i> file-audio-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-code-o">
                          <i class="mr-2 fa fa-file-code-o"></i> file-code-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-excel-o">
                          <i class="mr-2 fa fa-file-excel-o"></i> file-excel-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-image-o"></i> file-image-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-video-o">
                          <i class="mr-2 fa fa-file-movie-o"></i> file-movie-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-o">
                          <i class="mr-2 fa fa-file-o"></i> file-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-pdf-o">
                          <i class="mr-2 fa fa-file-pdf-o"></i> file-pdf-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-photo-o"></i> file-photo-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-image-o">
                          <i class="mr-2 fa fa-file-picture-o"></i> file-picture-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-powerpoint-o">
                          <i class="mr-2 fa fa-file-powerpoint-o"></i> file-powerpoint-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-audio-o">
                          <i class="mr-2 fa fa-file-sound-o"></i> file-sound-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-text">
                          <i class="mr-2 fa fa-file-text"></i> file-text</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-text-o">
                          <i class="mr-2 fa fa-file-text-o"></i> file-text-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-video-o">
                          <i class="mr-2 fa fa-file-video-o"></i> file-video-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-word-o">
                          <i class="mr-2 fa fa-file-word-o"></i> file-word-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-archive-o">
                          <i class="mr-2 fa fa-file-zip-o"></i> file-zip-o </a>
                      </div>
                    </div>
                  </section>
                  <section id="spinner">
                    <h2 class="color-primary mt-4 mb-2">Spinner Icons</h2>
                    <div class="alert alert-success">
                      <ul class="fa-ul">
                        <li>
                          <i class="mr-2 fa fa-info-circle fa-lg fa-li"></i>
                          <strong class="sr-only">Note:</strong> These icons work great with the <code>fa-spin</code> class. Check out the
                          <a href="../examples/index.html#animated" class="alert-link">spinning icons example</a>. </li>
                      </ul>
                    </div>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle-o-notch">
                          <i class="mr-2 fa fa-circle-o-notch"></i> circle-o-notch</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cog">
                          <i class="mr-2 fa fa-cog"></i> cog</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cog">
                          <i class="mr-2 fa fa-gear"></i> gear </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/refresh">
                          <i class="mr-2 fa fa-refresh"></i> refresh</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/spinner">
                          <i class="mr-2 fa fa-spinner"></i> spinner</a>
                      </div>
                    </div>
                  </section>
                  <section id="form-control">
                    <h2 class="color-primary mt-4 mb-2">Form Control Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-square">
                          <i class="mr-2 fa fa-check-square"></i> check-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/check-square-o">
                          <i class="mr-2 fa fa-check-square-o"></i> check-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle">
                          <i class="mr-2 fa fa-circle"></i> circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/circle-o">
                          <i class="mr-2 fa fa-circle-o"></i> circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/dot-circle-o">
                          <i class="mr-2 fa fa-dot-circle-o"></i> dot-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus-square">
                          <i class="mr-2 fa fa-minus-square"></i> minus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/minus-square-o">
                          <i class="mr-2 fa fa-minus-square-o"></i> minus-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-square">
                          <i class="mr-2 fa fa-plus-square"></i> plus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-square-o">
                          <i class="mr-2 fa fa-plus-square-o"></i> plus-square-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/square">
                          <i class="mr-2 fa fa-square"></i> square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/square-o">
                          <i class="mr-2 fa fa-square-o"></i> square-o</a>
                      </div>
                    </div>
                  </section>
                  <section id="payment">
                    <h2 class="color-primary mt-4 mb-2">Payment Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-amex">
                          <i class="mr-2 fa fa-cc-amex"></i> cc-amex</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-diners-club">
                          <i class="mr-2 fa fa-cc-diners-club"></i> cc-diners-club</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-discover">
                          <i class="mr-2 fa fa-cc-discover"></i> cc-discover</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-jcb">
                          <i class="mr-2 fa fa-cc-jcb"></i> cc-jcb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-mastercard">
                          <i class="mr-2 fa fa-cc-mastercard"></i> cc-mastercard</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-paypal">
                          <i class="mr-2 fa fa-cc-paypal"></i> cc-paypal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-stripe">
                          <i class="mr-2 fa fa-cc-stripe"></i> cc-stripe</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-visa">
                          <i class="mr-2 fa fa-cc-visa"></i> cc-visa</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/credit-card">
                          <i class="mr-2 fa fa-credit-card"></i> credit-card</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/credit-card-alt">
                          <i class="mr-2 fa fa-credit-card-alt"></i> credit-card-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-wallet">
                          <i class="mr-2 fa fa-google-wallet"></i> google-wallet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paypal">
                          <i class="mr-2 fa fa-paypal"></i> paypal</a>
                      </div>
                    </div>
                  </section>
                  <section id="chart">
                    <h2 class="color-primary mt-4 mb-2">Chart Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/area-chart">
                          <i class="mr-2 fa fa-area-chart"></i> area-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bar-chart">
                          <i class="mr-2 fa fa-bar-chart"></i> bar-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bar-chart">
                          <i class="mr-2 fa fa-bar-chart-o"></i> bar-chart-o </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/line-chart">
                          <i class="mr-2 fa fa-line-chart"></i> line-chart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pie-chart">
                          <i class="mr-2 fa fa-pie-chart"></i> pie-chart</a>
                      </div>
                    </div>
                  </section>
                  <section id="currency">
                    <h2 class="color-primary mt-4 mb-2">Currency Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/btc">
                          <i class="mr-2 fa fa-bitcoin"></i> bitcoin </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/btc">
                          <i class="mr-2 fa fa-btc"></i> btc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/jpy">
                          <i class="mr-2 fa fa-cny"></i> cny </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/usd">
                          <i class="mr-2 fa fa-dollar"></i> dollar </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eur">
                          <i class="mr-2 fa fa-eur"></i> eur</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eur">
                          <i class="mr-2 fa fa-euro"></i> euro </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gbp">
                          <i class="mr-2 fa fa-gbp"></i> gbp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gg">
                          <i class="mr-2 fa fa-gg"></i> gg</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gg-circle">
                          <i class="mr-2 fa fa-gg-circle"></i> gg-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ils">
                          <i class="mr-2 fa fa-ils"></i> ils</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/inr">
                          <i class="mr-2 fa fa-inr"></i> inr</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/jpy">
                          <i class="mr-2 fa fa-jpy"></i> jpy</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/krw">
                          <i class="mr-2 fa fa-krw"></i> krw</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/money">
                          <i class="mr-2 fa fa-money"></i> money</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/jpy">
                          <i class="mr-2 fa fa-rmb"></i> rmb </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rub">
                          <i class="mr-2 fa fa-rouble"></i> rouble </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rub">
                          <i class="mr-2 fa fa-rub"></i> rub</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rub">
                          <i class="mr-2 fa fa-ruble"></i> ruble </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/inr">
                          <i class="mr-2 fa fa-rupee"></i> rupee </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ils">
                          <i class="mr-2 fa fa-shekel"></i> shekel </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ils">
                          <i class="mr-2 fa fa-sheqel"></i> sheqel </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/try">
                          <i class="mr-2 fa fa-try"></i> try</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/try">
                          <i class="mr-2 fa fa-turkish-lira"></i> turkish-lira </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/usd">
                          <i class="mr-2 fa fa-usd"></i> usd</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/krw">
                          <i class="mr-2 fa fa-won"></i> won </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/jpy">
                          <i class="mr-2 fa fa-yen"></i> yen </a>
                      </div>
                    </div>
                  </section>
                  <section id="text-editor">
                    <h2 class="color-primary mt-4 mb-2">Text Editor Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/align-center">
                          <i class="mr-2 fa fa-align-center"></i> align-center</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/align-justify">
                          <i class="mr-2 fa fa-align-justify"></i> align-justify</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/align-left">
                          <i class="mr-2 fa fa-align-left"></i> align-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/align-right">
                          <i class="mr-2 fa fa-align-right"></i> align-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bold">
                          <i class="mr-2 fa fa-bold"></i> bold</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/link">
                          <i class="mr-2 fa fa-chain"></i> chain </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chain-broken">
                          <i class="mr-2 fa fa-chain-broken"></i> chain-broken</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/clipboard">
                          <i class="mr-2 fa fa-clipboard"></i> clipboard</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/columns">
                          <i class="mr-2 fa fa-columns"></i> columns</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/files-o">
                          <i class="mr-2 fa fa-copy"></i> copy </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/scissors">
                          <i class="mr-2 fa fa-cut"></i> cut </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/outdent">
                          <i class="mr-2 fa fa-dedent"></i> dedent </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eraser">
                          <i class="mr-2 fa fa-eraser"></i> eraser</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file">
                          <i class="mr-2 fa fa-file"></i> file</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-o">
                          <i class="mr-2 fa fa-file-o"></i> file-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-text">
                          <i class="mr-2 fa fa-file-text"></i> file-text</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/file-text-o">
                          <i class="mr-2 fa fa-file-text-o"></i> file-text-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/files-o">
                          <i class="mr-2 fa fa-files-o"></i> files-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/floppy-o">
                          <i class="mr-2 fa fa-floppy-o"></i> floppy-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/font">
                          <i class="mr-2 fa fa-font"></i> font</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/header">
                          <i class="mr-2 fa fa-header"></i> header</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/indent">
                          <i class="mr-2 fa fa-indent"></i> indent</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/italic">
                          <i class="mr-2 fa fa-italic"></i> italic</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/link">
                          <i class="mr-2 fa fa-link"></i> link</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/list">
                          <i class="mr-2 fa fa-list"></i> list</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/list-alt">
                          <i class="mr-2 fa fa-list-alt"></i> list-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/list-ol">
                          <i class="mr-2 fa fa-list-ol"></i> list-ol</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/list-ul">
                          <i class="mr-2 fa fa-list-ul"></i> list-ul</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/outdent">
                          <i class="mr-2 fa fa-outdent"></i> outdent</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paperclip">
                          <i class="mr-2 fa fa-paperclip"></i> paperclip</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paragraph">
                          <i class="mr-2 fa fa-paragraph"></i> paragraph</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/clipboard">
                          <i class="mr-2 fa fa-paste"></i> paste </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/repeat">
                          <i class="mr-2 fa fa-repeat"></i> repeat</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/undo">
                          <i class="mr-2 fa fa-rotate-left"></i> rotate-left </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/repeat">
                          <i class="mr-2 fa fa-rotate-right"></i> rotate-right </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/floppy-o">
                          <i class="mr-2 fa fa-save"></i> save </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/scissors">
                          <i class="mr-2 fa fa-scissors"></i> scissors</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/strikethrough">
                          <i class="mr-2 fa fa-strikethrough"></i> strikethrough</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/subscript">
                          <i class="mr-2 fa fa-subscript"></i> subscript</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/superscript">
                          <i class="mr-2 fa fa-superscript"></i> superscript</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/table">
                          <i class="mr-2 fa fa-table"></i> table</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/text-height">
                          <i class="mr-2 fa fa-text-height"></i> text-height</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/text-width">
                          <i class="mr-2 fa fa-text-width"></i> text-width</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/th">
                          <i class="mr-2 fa fa-th"></i> th</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/th-large">
                          <i class="mr-2 fa fa-th-large"></i> th-large</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/th-list">
                          <i class="mr-2 fa fa-th-list"></i> th-list</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/underline">
                          <i class="mr-2 fa fa-underline"></i> underline</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/undo">
                          <i class="mr-2 fa fa-undo"></i> undo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chain-broken">
                          <i class="mr-2 fa fa-unlink"></i> unlink </a>
                      </div>
                    </div>
                  </section>
                  <section id="directional">
                    <h2 class="color-primary mt-4 mb-2">Directional Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-double-down">
                          <i class="mr-2 fa fa-angle-double-down"></i> angle-double-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-double-left">
                          <i class="mr-2 fa fa-angle-double-left"></i> angle-double-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-double-right">
                          <i class="mr-2 fa fa-angle-double-right"></i> angle-double-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-double-up">
                          <i class="mr-2 fa fa-angle-double-up"></i> angle-double-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-down">
                          <i class="mr-2 fa fa-angle-down"></i> angle-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-left">
                          <i class="mr-2 fa fa-angle-left"></i> angle-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-right">
                          <i class="mr-2 fa fa-angle-right"></i> angle-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angle-up">
                          <i class="mr-2 fa fa-angle-up"></i> angle-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-down">
                          <i class="mr-2 fa fa-arrow-circle-down"></i> arrow-circle-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-left">
                          <i class="mr-2 fa fa-arrow-circle-left"></i> arrow-circle-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-o-down">
                          <i class="mr-2 fa fa-arrow-circle-o-down"></i> arrow-circle-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-o-left">
                          <i class="mr-2 fa fa-arrow-circle-o-left"></i> arrow-circle-o-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-o-right">
                          <i class="mr-2 fa fa-arrow-circle-o-right"></i> arrow-circle-o-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-o-up">
                          <i class="mr-2 fa fa-arrow-circle-o-up"></i> arrow-circle-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-right">
                          <i class="mr-2 fa fa-arrow-circle-right"></i> arrow-circle-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-circle-up">
                          <i class="mr-2 fa fa-arrow-circle-up"></i> arrow-circle-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-down">
                          <i class="mr-2 fa fa-arrow-down"></i> arrow-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-left">
                          <i class="mr-2 fa fa-arrow-left"></i> arrow-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-right">
                          <i class="mr-2 fa fa-arrow-right"></i> arrow-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrow-up">
                          <i class="mr-2 fa fa-arrow-up"></i> arrow-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows">
                          <i class="mr-2 fa fa-arrows"></i> arrows</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-alt">
                          <i class="mr-2 fa fa-arrows-alt"></i> arrows-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-h">
                          <i class="mr-2 fa fa-arrows-h"></i> arrows-h</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-v">
                          <i class="mr-2 fa fa-arrows-v"></i> arrows-v</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-down">
                          <i class="mr-2 fa fa-caret-down"></i> caret-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-left">
                          <i class="mr-2 fa fa-caret-left"></i> caret-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-right">
                          <i class="mr-2 fa fa-caret-right"></i> caret-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-down">
                          <i class="mr-2 fa fa-caret-square-o-down"></i> caret-square-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-left">
                          <i class="mr-2 fa fa-caret-square-o-left"></i> caret-square-o-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-right">
                          <i class="mr-2 fa fa-caret-square-o-right"></i> caret-square-o-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-up">
                          <i class="mr-2 fa fa-caret-square-o-up"></i> caret-square-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-up">
                          <i class="mr-2 fa fa-caret-up"></i> caret-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-circle-down">
                          <i class="mr-2 fa fa-chevron-circle-down"></i> chevron-circle-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-circle-left">
                          <i class="mr-2 fa fa-chevron-circle-left"></i> chevron-circle-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-circle-right">
                          <i class="mr-2 fa fa-chevron-circle-right"></i> chevron-circle-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-circle-up">
                          <i class="mr-2 fa fa-chevron-circle-up"></i> chevron-circle-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-down">
                          <i class="mr-2 fa fa-chevron-down"></i> chevron-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-left">
                          <i class="mr-2 fa fa-chevron-left"></i> chevron-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-right">
                          <i class="mr-2 fa fa-chevron-right"></i> chevron-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chevron-up">
                          <i class="mr-2 fa fa-chevron-up"></i> chevron-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/exchange">
                          <i class="mr-2 fa fa-exchange"></i> exchange</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-down">
                          <i class="mr-2 fa fa-hand-o-down"></i> hand-o-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-left">
                          <i class="mr-2 fa fa-hand-o-left"></i> hand-o-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-right">
                          <i class="mr-2 fa fa-hand-o-right"></i> hand-o-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hand-o-up">
                          <i class="mr-2 fa fa-hand-o-up"></i> hand-o-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/long-arrow-down">
                          <i class="mr-2 fa fa-long-arrow-down"></i> long-arrow-down</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/long-arrow-left">
                          <i class="mr-2 fa fa-long-arrow-left"></i> long-arrow-left</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/long-arrow-right">
                          <i class="mr-2 fa fa-long-arrow-right"></i> long-arrow-right</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/long-arrow-up">
                          <i class="mr-2 fa fa-long-arrow-up"></i> long-arrow-up</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-down">
                          <i class="mr-2 fa fa-toggle-down"></i> toggle-down </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-left">
                          <i class="mr-2 fa fa-toggle-left"></i> toggle-left </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-right">
                          <i class="mr-2 fa fa-toggle-right"></i> toggle-right </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/caret-square-o-up">
                          <i class="mr-2 fa fa-toggle-up"></i> toggle-up </a>
                      </div>
                    </div>
                  </section>
                  <section id="video-player">
                    <h2 class="color-primary mt-4 mb-2">Video Player Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/arrows-alt">
                          <i class="mr-2 fa fa-arrows-alt"></i> arrows-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/backward">
                          <i class="mr-2 fa fa-backward"></i> backward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/compress">
                          <i class="mr-2 fa fa-compress"></i> compress</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eject">
                          <i class="mr-2 fa fa-eject"></i> eject</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/expand">
                          <i class="mr-2 fa fa-expand"></i> expand</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fast-backward">
                          <i class="mr-2 fa fa-fast-backward"></i> fast-backward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fast-forward">
                          <i class="mr-2 fa fa-fast-forward"></i> fast-forward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/forward">
                          <i class="mr-2 fa fa-forward"></i> forward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pause">
                          <i class="mr-2 fa fa-pause"></i> pause</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pause-circle">
                          <i class="mr-2 fa fa-pause-circle"></i> pause-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pause-circle-o">
                          <i class="mr-2 fa fa-pause-circle-o"></i> pause-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/play">
                          <i class="mr-2 fa fa-play"></i> play</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/play-circle">
                          <i class="mr-2 fa fa-play-circle"></i> play-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/play-circle-o">
                          <i class="mr-2 fa fa-play-circle-o"></i> play-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/random">
                          <i class="mr-2 fa fa-random"></i> random</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/step-backward">
                          <i class="mr-2 fa fa-step-backward"></i> step-backward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/step-forward">
                          <i class="mr-2 fa fa-step-forward"></i> step-forward</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stop">
                          <i class="mr-2 fa fa-stop"></i> stop</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stop-circle">
                          <i class="mr-2 fa fa-stop-circle"></i> stop-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stop-circle-o">
                          <i class="mr-2 fa fa-stop-circle-o"></i> stop-circle-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/youtube-play">
                          <i class="mr-2 fa fa-youtube-play"></i> youtube-play</a>
                      </div>
                    </div>
                  </section>
                  <section id="brand">
                    <h2 class="color-primary mt-4 mb-2">Brand Icons</h2>
                    <div class="row fontawesome-icon-list margin-bottom-lg">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/500px">
                          <i class="mr-2 fa fa-500px"></i> 500px</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/adn">
                          <i class="mr-2 fa fa-adn"></i> adn</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/amazon">
                          <i class="mr-2 fa fa-amazon"></i> amazon</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/android">
                          <i class="mr-2 fa fa-android"></i> android</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/angellist">
                          <i class="mr-2 fa fa-angellist"></i> angellist</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/apple">
                          <i class="mr-2 fa fa-apple"></i> apple</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bandcamp">
                          <i class="mr-2 fa fa-bandcamp"></i> bandcamp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/behance">
                          <i class="mr-2 fa fa-behance"></i> behance</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/behance-square">
                          <i class="mr-2 fa fa-behance-square"></i> behance-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bitbucket">
                          <i class="mr-2 fa fa-bitbucket"></i> bitbucket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bitbucket-square">
                          <i class="mr-2 fa fa-bitbucket-square"></i> bitbucket-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/btc">
                          <i class="mr-2 fa fa-bitcoin"></i> bitcoin </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/black-tie">
                          <i class="mr-2 fa fa-black-tie"></i> black-tie</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bluetooth">
                          <i class="mr-2 fa fa-bluetooth"></i> bluetooth</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/bluetooth-b">
                          <i class="mr-2 fa fa-bluetooth-b"></i> bluetooth-b</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/btc">
                          <i class="mr-2 fa fa-btc"></i> btc</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/buysellads">
                          <i class="mr-2 fa fa-buysellads"></i> buysellads</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-amex">
                          <i class="mr-2 fa fa-cc-amex"></i> cc-amex</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-diners-club">
                          <i class="mr-2 fa fa-cc-diners-club"></i> cc-diners-club</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-discover">
                          <i class="mr-2 fa fa-cc-discover"></i> cc-discover</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-jcb">
                          <i class="mr-2 fa fa-cc-jcb"></i> cc-jcb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-mastercard">
                          <i class="mr-2 fa fa-cc-mastercard"></i> cc-mastercard</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-paypal">
                          <i class="mr-2 fa fa-cc-paypal"></i> cc-paypal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-stripe">
                          <i class="mr-2 fa fa-cc-stripe"></i> cc-stripe</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/cc-visa">
                          <i class="mr-2 fa fa-cc-visa"></i> cc-visa</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/chrome">
                          <i class="mr-2 fa fa-chrome"></i> chrome</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/codepen">
                          <i class="mr-2 fa fa-codepen"></i> codepen</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/codiepie">
                          <i class="mr-2 fa fa-codiepie"></i> codiepie</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/connectdevelop">
                          <i class="mr-2 fa fa-connectdevelop"></i> connectdevelop</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/contao">
                          <i class="mr-2 fa fa-contao"></i> contao</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/css3">
                          <i class="mr-2 fa fa-css3"></i> css3</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/dashcube">
                          <i class="mr-2 fa fa-dashcube"></i> dashcube</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/delicious">
                          <i class="mr-2 fa fa-delicious"></i> delicious</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/deviantart">
                          <i class="mr-2 fa fa-deviantart"></i> deviantart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/digg">
                          <i class="mr-2 fa fa-digg"></i> digg</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/dribbble">
                          <i class="mr-2 fa fa-dribbble"></i> dribbble</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/dropbox">
                          <i class="mr-2 fa fa-dropbox"></i> dropbox</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/drupal">
                          <i class="mr-2 fa fa-drupal"></i> drupal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/edge">
                          <i class="mr-2 fa fa-edge"></i> edge</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/eercast">
                          <i class="mr-2 fa fa-eercast"></i> eercast</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/empire">
                          <i class="mr-2 fa fa-empire"></i> empire</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/envira">
                          <i class="mr-2 fa fa-envira"></i> envira</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/etsy">
                          <i class="mr-2 fa fa-etsy"></i> etsy</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/expeditedssl">
                          <i class="mr-2 fa fa-expeditedssl"></i> expeditedssl</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/font-awesome">
                          <i class="mr-2 fa fa-fa"></i> fa </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/facebook">
                          <i class="mr-2 fa fa-facebook"></i> facebook</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/facebook">
                          <i class="mr-2 fa fa-facebook-f"></i> facebook-f </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/facebook-official">
                          <i class="mr-2 fa fa-facebook-official"></i> facebook-official</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/facebook-square">
                          <i class="mr-2 fa fa-facebook-square"></i> facebook-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/firefox">
                          <i class="mr-2 fa fa-firefox"></i> firefox</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/first-order">
                          <i class="mr-2 fa fa-first-order"></i> first-order</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/flickr">
                          <i class="mr-2 fa fa-flickr"></i> flickr</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/font-awesome">
                          <i class="mr-2 fa fa-font-awesome"></i> font-awesome</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fonticons">
                          <i class="mr-2 fa fa-fonticons"></i> fonticons</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/fort-awesome">
                          <i class="mr-2 fa fa-fort-awesome"></i> fort-awesome</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/forumbee">
                          <i class="mr-2 fa fa-forumbee"></i> forumbee</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/foursquare">
                          <i class="mr-2 fa fa-foursquare"></i> foursquare</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/free-code-camp">
                          <i class="mr-2 fa fa-free-code-camp"></i> free-code-camp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/empire">
                          <i class="mr-2 fa fa-ge"></i> ge </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/get-pocket">
                          <i class="mr-2 fa fa-get-pocket"></i> get-pocket</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gg">
                          <i class="mr-2 fa fa-gg"></i> gg</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gg-circle">
                          <i class="mr-2 fa fa-gg-circle"></i> gg-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/git">
                          <i class="mr-2 fa fa-git"></i> git</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/git-square">
                          <i class="mr-2 fa fa-git-square"></i> git-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/github">
                          <i class="mr-2 fa fa-github"></i> github</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/github-alt">
                          <i class="mr-2 fa fa-github-alt"></i> github-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/github-square">
                          <i class="mr-2 fa fa-github-square"></i> github-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gitlab">
                          <i class="mr-2 fa fa-gitlab"></i> gitlab</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gratipay">
                          <i class="mr-2 fa fa-gittip"></i> gittip </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/glide">
                          <i class="mr-2 fa fa-glide"></i> glide</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/glide-g">
                          <i class="mr-2 fa fa-glide-g"></i> glide-g</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google">
                          <i class="mr-2 fa fa-google"></i> google</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-plus">
                          <i class="mr-2 fa fa-google-plus"></i> google-plus</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-plus-official">
                          <i class="mr-2 fa fa-google-plus-circle"></i> google-plus-circle </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-plus-official">
                          <i class="mr-2 fa fa-google-plus-official"></i> google-plus-official</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-plus-square">
                          <i class="mr-2 fa fa-google-plus-square"></i> google-plus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/google-wallet">
                          <i class="mr-2 fa fa-google-wallet"></i> google-wallet</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/gratipay">
                          <i class="mr-2 fa fa-gratipay"></i> gratipay</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/grav">
                          <i class="mr-2 fa fa-grav"></i> grav</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hacker-news">
                          <i class="mr-2 fa fa-hacker-news"></i> hacker-news</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/houzz">
                          <i class="mr-2 fa fa-houzz"></i> houzz</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/html5">
                          <i class="mr-2 fa fa-html5"></i> html5</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/imdb">
                          <i class="mr-2 fa fa-imdb"></i> imdb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/instagram">
                          <i class="mr-2 fa fa-instagram"></i> instagram</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/internet-explorer">
                          <i class="mr-2 fa fa-internet-explorer"></i> internet-explorer</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ioxhost">
                          <i class="mr-2 fa fa-ioxhost"></i> ioxhost</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/joomla">
                          <i class="mr-2 fa fa-joomla"></i> joomla</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/jsfiddle">
                          <i class="mr-2 fa fa-jsfiddle"></i> jsfiddle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/lastfm">
                          <i class="mr-2 fa fa-lastfm"></i> lastfm</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/lastfm-square">
                          <i class="mr-2 fa fa-lastfm-square"></i> lastfm-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/leanpub">
                          <i class="mr-2 fa fa-leanpub"></i> leanpub</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/linkedin">
                          <i class="mr-2 fa fa-linkedin"></i> linkedin</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/linkedin-square">
                          <i class="mr-2 fa fa-linkedin-square"></i> linkedin-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/linode">
                          <i class="mr-2 fa fa-linode"></i> linode</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/linux">
                          <i class="mr-2 fa fa-linux"></i> linux</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/maxcdn">
                          <i class="mr-2 fa fa-maxcdn"></i> maxcdn</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/meanpath">
                          <i class="mr-2 fa fa-meanpath"></i> meanpath</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/medium">
                          <i class="mr-2 fa fa-medium"></i> medium</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/meetup">
                          <i class="mr-2 fa fa-meetup"></i> meetup</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/mixcloud">
                          <i class="mr-2 fa fa-mixcloud"></i> mixcloud</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/modx">
                          <i class="mr-2 fa fa-modx"></i> modx</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/odnoklassniki">
                          <i class="mr-2 fa fa-odnoklassniki"></i> odnoklassniki</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/odnoklassniki-square">
                          <i class="mr-2 fa fa-odnoklassniki-square"></i> odnoklassniki-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/opencart">
                          <i class="mr-2 fa fa-opencart"></i> opencart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/openid">
                          <i class="mr-2 fa fa-openid"></i> openid</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/opera">
                          <i class="mr-2 fa fa-opera"></i> opera</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/optin-monster">
                          <i class="mr-2 fa fa-optin-monster"></i> optin-monster</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pagelines">
                          <i class="mr-2 fa fa-pagelines"></i> pagelines</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/paypal">
                          <i class="mr-2 fa fa-paypal"></i> paypal</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pied-piper">
                          <i class="mr-2 fa fa-pied-piper"></i> pied-piper</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pied-piper-alt">
                          <i class="mr-2 fa fa-pied-piper-alt"></i> pied-piper-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pied-piper-pp">
                          <i class="mr-2 fa fa-pied-piper-pp"></i> pied-piper-pp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pinterest">
                          <i class="mr-2 fa fa-pinterest"></i> pinterest</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pinterest-p">
                          <i class="mr-2 fa fa-pinterest-p"></i> pinterest-p</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/pinterest-square">
                          <i class="mr-2 fa fa-pinterest-square"></i> pinterest-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/product-hunt">
                          <i class="mr-2 fa fa-product-hunt"></i> product-hunt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/qq">
                          <i class="mr-2 fa fa-qq"></i> qq</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/quora">
                          <i class="mr-2 fa fa-quora"></i> quora</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rebel">
                          <i class="mr-2 fa fa-ra"></i> ra </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ravelry">
                          <i class="mr-2 fa fa-ravelry"></i> ravelry</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rebel">
                          <i class="mr-2 fa fa-rebel"></i> rebel</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reddit">
                          <i class="mr-2 fa fa-reddit"></i> reddit</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reddit-alien">
                          <i class="mr-2 fa fa-reddit-alien"></i> reddit-alien</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/reddit-square">
                          <i class="mr-2 fa fa-reddit-square"></i> reddit-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/renren">
                          <i class="mr-2 fa fa-renren"></i> renren</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/rebel">
                          <i class="mr-2 fa fa-resistance"></i> resistance </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/safari">
                          <i class="mr-2 fa fa-safari"></i> safari</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/scribd">
                          <i class="mr-2 fa fa-scribd"></i> scribd</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/sellsy">
                          <i class="mr-2 fa fa-sellsy"></i> sellsy</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-alt">
                          <i class="mr-2 fa fa-share-alt"></i> share-alt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/share-alt-square">
                          <i class="mr-2 fa fa-share-alt-square"></i> share-alt-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/shirtsinbulk">
                          <i class="mr-2 fa fa-shirtsinbulk"></i> shirtsinbulk</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/simplybuilt">
                          <i class="mr-2 fa fa-simplybuilt"></i> simplybuilt</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/skyatlas">
                          <i class="mr-2 fa fa-skyatlas"></i> skyatlas</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/skype">
                          <i class="mr-2 fa fa-skype"></i> skype</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/slack">
                          <i class="mr-2 fa fa-slack"></i> slack</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/slideshare">
                          <i class="mr-2 fa fa-slideshare"></i> slideshare</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/snapchat">
                          <i class="mr-2 fa fa-snapchat"></i> snapchat</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/snapchat-ghost">
                          <i class="mr-2 fa fa-snapchat-ghost"></i> snapchat-ghost</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/snapchat-square">
                          <i class="mr-2 fa fa-snapchat-square"></i> snapchat-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/soundcloud">
                          <i class="mr-2 fa fa-soundcloud"></i> soundcloud</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/spotify">
                          <i class="mr-2 fa fa-spotify"></i> spotify</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stack-exchange">
                          <i class="mr-2 fa fa-stack-exchange"></i> stack-exchange</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stack-overflow">
                          <i class="mr-2 fa fa-stack-overflow"></i> stack-overflow</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/steam">
                          <i class="mr-2 fa fa-steam"></i> steam</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/steam-square">
                          <i class="mr-2 fa fa-steam-square"></i> steam-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stumbleupon">
                          <i class="mr-2 fa fa-stumbleupon"></i> stumbleupon</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stumbleupon-circle">
                          <i class="mr-2 fa fa-stumbleupon-circle"></i> stumbleupon-circle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/superpowers">
                          <i class="mr-2 fa fa-superpowers"></i> superpowers</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/telegram">
                          <i class="mr-2 fa fa-telegram"></i> telegram</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tencent-weibo">
                          <i class="mr-2 fa fa-tencent-weibo"></i> tencent-weibo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/themeisle">
                          <i class="mr-2 fa fa-themeisle"></i> themeisle</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/trello">
                          <i class="mr-2 fa fa-trello"></i> trello</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tripadvisor">
                          <i class="mr-2 fa fa-tripadvisor"></i> tripadvisor</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tumblr">
                          <i class="mr-2 fa fa-tumblr"></i> tumblr</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/tumblr-square">
                          <i class="mr-2 fa fa-tumblr-square"></i> tumblr-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/twitch">
                          <i class="mr-2 fa fa-twitch"></i> twitch</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/twitter">
                          <i class="mr-2 fa fa-twitter"></i> twitter</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/twitter-square">
                          <i class="mr-2 fa fa-twitter-square"></i> twitter-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/usb">
                          <i class="mr-2 fa fa-usb"></i> usb</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/viacoin">
                          <i class="mr-2 fa fa-viacoin"></i> viacoin</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/viadeo">
                          <i class="mr-2 fa fa-viadeo"></i> viadeo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/viadeo-square">
                          <i class="mr-2 fa fa-viadeo-square"></i> viadeo-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/vimeo">
                          <i class="mr-2 fa fa-vimeo"></i> vimeo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/vimeo-square">
                          <i class="mr-2 fa fa-vimeo-square"></i> vimeo-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/vine">
                          <i class="mr-2 fa fa-vine"></i> vine</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/vk">
                          <i class="mr-2 fa fa-vk"></i> vk</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/weixin">
                          <i class="mr-2 fa fa-wechat"></i> wechat </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/weibo">
                          <i class="mr-2 fa fa-weibo"></i> weibo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/weixin">
                          <i class="mr-2 fa fa-weixin"></i> weixin</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/whatsapp">
                          <i class="mr-2 fa fa-whatsapp"></i> whatsapp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wikipedia-w">
                          <i class="mr-2 fa fa-wikipedia-w"></i> wikipedia-w</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/windows">
                          <i class="mr-2 fa fa-windows"></i> windows</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wordpress">
                          <i class="mr-2 fa fa-wordpress"></i> wordpress</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wpbeginner">
                          <i class="mr-2 fa fa-wpbeginner"></i> wpbeginner</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wpexplorer">
                          <i class="mr-2 fa fa-wpexplorer"></i> wpexplorer</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wpforms">
                          <i class="mr-2 fa fa-wpforms"></i> wpforms</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/xing">
                          <i class="mr-2 fa fa-xing"></i> xing</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/xing-square">
                          <i class="mr-2 fa fa-xing-square"></i> xing-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/y-combinator">
                          <i class="mr-2 fa fa-y-combinator"></i> y-combinator</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hacker-news">
                          <i class="mr-2 fa fa-y-combinator-square"></i> y-combinator-square </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/yahoo">
                          <i class="mr-2 fa fa-yahoo"></i> yahoo</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/y-combinator">
                          <i class="mr-2 fa fa-yc"></i> yc </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hacker-news">
                          <i class="mr-2 fa fa-yc-square"></i> yc-square </a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/yelp">
                          <i class="mr-2 fa fa-yelp"></i> yelp</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/yoast">
                          <i class="mr-2 fa fa-yoast"></i> yoast</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/youtube">
                          <i class="mr-2 fa fa-youtube"></i> youtube</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/youtube-play">
                          <i class="mr-2 fa fa-youtube-play"></i> youtube-play</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/youtube-square">
                          <i class="mr-2 fa fa-youtube-square"></i> youtube-square</a>
                      </div>
                    </div>
                    <div class="alert alert-warning">
                      <h4>
                        <i class="mr-2 fa fa-warning" aria-hidden "true"></i> Warning!</h4> Apparently, Adblock Plus can remove Font Awesome brand icons with their "Remove Social Media Buttons" setting. We will not use hacks to force them to display. Please
                      <a href="https://adblockplus.org/en/bugs"
                        class="alert-link">report an issue with Adblock Plus</a> if you believe this to be an error. To work around this, you'll need to modify the social icon class names. </div>
                    <div class="alert alert-success">
                      <ul class="margin-bottom-none padding-left-lg">
                        <li>All brand icons are trademarks of their respective owners.</li>
                        <li>The use of these trademarks does not indicate endorsement of the trademark holder by Font Awesome, nor vice versa.</li>
                        <li>Brand icons should only be used to represent the company or product to which they refer.</li>
                        <li class="strong">Please do not use brand logos for any purpose except to represent that particular brand or service.</li>
                      </ul>
                    </div>
                  </section>
                  <section id="medical">
                    <h2 class="color-primary mt-4 mb-2">Medical Icons</h2>
                    <div class="row fontawesome-icon-list">
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/ambulance">
                          <i class="mr-2 fa fa-ambulance"></i> ambulance</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/h-square">
                          <i class="mr-2 fa fa-h-square"></i> h-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heart">
                          <i class="mr-2 fa fa-heart"></i> heart</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heart-o">
                          <i class="mr-2 fa fa-heart-o"></i> heart-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/heartbeat">
                          <i class="mr-2 fa fa-heartbeat"></i> heartbeat</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/hospital-o">
                          <i class="mr-2 fa fa-hospital-o"></i> hospital-o</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/medkit">
                          <i class="mr-2 fa fa-medkit"></i> medkit</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/plus-square">
                          <i class="mr-2 fa fa-plus-square"></i> plus-square</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/stethoscope">
                          <i class="mr-2 fa fa-stethoscope"></i> stethoscope</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/user-md">
                          <i class="mr-2 fa fa-user-md"></i> user-md</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair">
                          <i class="mr-2 fa fa-wheelchair"></i> wheelchair</a>
                      </div>
                      <div class="col-sm-4 pt-1 pb-1">
                        <a class="color-dark " href="http://fontawesome.io/icon/wheelchair-alt">
                          <i class="mr-2 fa fa-wheelchair-alt"></i> wheelchair-alt</a>
                      </div>
                    </div>
                  </section>
                </section>
              </div>
              <!-- ms-paper-content -->
            </div>
            <!-- col-lg-9 -->
          </div>
          <!-- row -->
        </div>
        <!-- ms-paper -->
      </div>
      <!-- container -->
      <aside class="ms-footbar">
        <div class="container">
          <div class="row">
            <div class="col-lg-4 ms-footer-col">
              <div class="ms-footbar-block">
                <h3 class="ms-footbar-title">Sitemap</h3>
                <ul class="list-unstyled ms-icon-list three_cols">
                  <li>
                    <a href="index.html">
                      <i class="zmdi zmdi-home"></i> Home</a>
                  </li>
                  <li>
                    <a href="page-blog.html">
                      <i class="zmdi zmdi-edit"></i> Blog</a>
                  </li>
                  <li>
                    <a href="page-blog.html">
                      <i class="zmdi zmdi-image-o"></i> Portafolio</a>
                  </li>
                  <li>
                    <a href="portfolio-filters_sidebar.html">
                      <i class="zmdi zmdi-case"></i> Works</a>
                  </li>
                  <li>
                    <a href="page-timeline_left2.html">
                      <i class="zmdi zmdi-time"></i> Timeline</a>
                  </li>
                  <li>
                    <a href="page-pricing.html">
                      <i class="zmdi zmdi-money"></i> Pricing</a>
                  </li>
                  <li>
                    <a href="page-about.html">
                      <i class="zmdi zmdi-favorite-outline"></i> About Us</a>
                  </li>
                  <li>
                    <a href="page-team2.html">
                      <i class="zmdi zmdi-accounts"></i> Our Team</a>
                  </li>
                  <li>
                    <a href="page-services.html">
                      <i class="zmdi zmdi-face"></i> Services</a>
                  </li>
                  <li>
                    <a href="page-faq2.html">
                      <i class="zmdi zmdi-help"></i> FAQ</a>
                  </li>
                  <li>
                    <a href="page-login2.html">
                      <i class="zmdi zmdi-lock"></i> Login</a>
                  </li>
                  <li>
                    <a href="page-contact.html">
                      <i class="zmdi zmdi-email"></i> Contact</a>
                  </li>
                </ul>
              </div>
              <div class="ms-footbar-block">
                <h3 class="ms-footbar-title">Subscribe</h3>
                <p class="">Lorem ipsum Amet fugiat elit nisi anim mollit minim labore ut esse Duis ullamco ad dolor veniam velit.</p>
                <form>
                  <div class="form-group label-floating mt-2 mb-1">
                    <div class="input-group ms-input-subscribe">
                      <label class="control-label" for="ms-subscribe">
                        <i class="zmdi zmdi-email"></i> Email Adress</label>
                      <input type="email" id="ms-subscribe" class="form-control"> </div>
                  </div>
                  <button class="ms-subscribre-btn" type="button">Subscribe</button>
                </form>
              </div>
            </div>
            <div class="col-lg-5 col-md-7 ms-footer-col ms-footer-alt-color">
              <div class="ms-footbar-block">
                <h3 class="ms-footbar-title text-center mb-2">Last Articles</h3>
                <div class="ms-footer-media">
                  <div class="media">
                    <div class="media-left media-middle">
                      <a href="javascript:void(0)">
                        <img class="media-object media-object-circle" src="assets/img/demo/p75.jpg" alt="..."> </a>
                    </div>
                    <div class="media-body">
                      <h4 class="media-heading">
                        <a href="javascript:void(0)">Lorem ipsum dolor sit expedita cumque amet consectetur adipisicing repellat</a>
                      </h4>
                      <div class="media-footer">
                        <span>
                          <i class="zmdi zmdi-time color-info-light"></i> August 18, 2016</span>
                        <span>
                          <i class="zmdi zmdi-folder-outline color-warning-light"></i>
                          <a href="javascript:void(0)">Design</a>
                        </span>
                      </div>
                    </div>
                  </div>
                  <div class="media">
                    <div class="media-left media-middle">
                      <a href="javascript:void(0)">
                        <img class="media-object media-object-circle" src="assets/img/demo/p75.jpg" alt="..."> </a>
                    </div>
                    <div class="media-body">
                      <h4 class="media-heading">
                        <a href="javascript:void(0)">Labore ut esse Duis consectetur expedita cumque ullamco ad dolor veniam velit</a>
                      </h4>
                      <div class="media-footer">
                        <span>
                          <i class="zmdi zmdi-time color-info-light"></i> August 18, 2016</span>
                        <span>
                          <i class="zmdi zmdi-folder-outline color-warning-light"></i>
                          <a href="javascript:void(0)">News</a>
                        </span>
                      </div>
                    </div>
                  </div>
                  <div class="media">
                    <div class="media-left media-middle">
                      <a href="javascript:void(0)">
                        <img class="media-object media-object-circle" src="assets/img/demo/p75.jpg" alt="..."> </a>
                    </div>
                    <div class="media-body">
                      <h4 class="media-heading">
                        <a href="javascript:void(0)">voluptates deserunt ducimus expedita cumque quaerat molestiae labore</a>
                      </h4>
                      <div class="media-footer">
                        <span>
                          <i class="zmdi zmdi-time color-info-light"></i> August 18, 2016</span>
                        <span>
                          <i class="zmdi zmdi-folder-outline color-warning-light"></i>
                          <a href="javascript:void(0)">Productivity</a>
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="col-lg-3 col-md-5 ms-footer-col ms-footer-text-right">
              <div class="ms-footbar-block">
                <div class="ms-footbar-title">
                  <span class="ms-logo ms-logo-white ms-logo-sm mr-1">M</span>
                  <h3 class="no-m ms-site-title">Material
                    <span>Style</span>
                  </h3>
                </div>
                <address class="no-mb">
                  <p>
                    <i class="color-danger-light zmdi zmdi-pin mr-1"></i> 795 Folsom Ave, Suite 600</p>
                  <p>
                    <i class="color-warning-light zmdi zmdi-map mr-1"></i> San Francisco, CA 94107</p>
                  <p>
                    <i class="color-info-light zmdi zmdi-email mr-1"></i>
                    <a href="mailto:joe@example.com">example@domain.com</a>
                  </p>
                  <p>
                    <i class="color-royal-light zmdi zmdi-phone mr-1"></i>+34 123 456 7890 </p>
                  <p>
                    <i class="color-success-light fa fa-fax mr-1"></i>+34 123 456 7890 </p>
                </address>
              </div>
              <div class="ms-footbar-block">
                <h3 class="ms-footbar-title">Social Media</h3>
                <div class="ms-footbar-social">
                  <a href="javascript:void(0)" class="btn-circle btn-facebook">
                    <i class="zmdi zmdi-facebook"></i>
                  </a>
                  <a href="javascript:void(0)" class="btn-circle btn-twitter">
                    <i class="zmdi zmdi-twitter"></i>
                  </a>
                  <a href="javascript:void(0)" class="btn-circle btn-youtube">
                    <i class="zmdi zmdi-youtube-play"></i>
                  </a>
                  <br>
                  <a href="javascript:void(0)" class="btn-circle btn-google">
                    <i class="zmdi zmdi-google"></i>
                  </a>
                  <a href="javascript:void(0)" class="btn-circle btn-instagram">
                    <i class="zmdi zmdi-instagram"></i>
                  </a>
                  <a href="javascript:void(0)" class="btn-circle btn-github">
                    <i class="zmdi zmdi-github"></i>
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </aside>
      <footer class="ms-footer">
        <div class="container">
          <p>Copyright &copy; Material Style 2017</p>
        </div>
      </footer>
      <div class="btn-back-top">
        <a href="#" data-scroll id="back-top" class="btn-circle btn-circle-primary btn-circle-sm btn-circle-raised ">
          <i class="zmdi zmdi-long-arrow-up"></i>
        </a>
      </div>
    </div>
    <!-- ms-site-container -->
    <div class="ms-slidebar sb-slidebar sb-left sb-style-overlay" id="ms-slidebar">
      <div class="sb-slidebar-container">
        <header class="ms-slidebar-header">
          <div class="ms-slidebar-login">
            <a href="javascript:void(0)" class="withripple">
              <i class="zmdi zmdi-account"></i> Login</a>
            <a href="javascript:void(0)" class="withripple">
              <i class="zmdi zmdi-account-add"></i> Register</a>
          </div>
          <div class="ms-slidebar-title">
            <form class="search-form">
              <input id="search-box-slidebar" type="text" class="search-input" placeholder="Search..." name="q" />
              <label for="search-box-slidebar">
                <i class="zmdi zmdi-search"></i>
              </label>
            </form>
            <div class="ms-slidebar-t">
              <span class="ms-logo ms-logo-sm">M</span>
              <h3>Material
                <span>Style</span>
              </h3>
            </div>
          </div>
        </header>
        <ul class="ms-slidebar-menu" id="slidebar-menu" role="tablist" aria-multiselectable="true">
          <li class="card" role="tab" id="sch1">
            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#slidebar-menu" href="#sc1" aria-expanded="false" aria-controls="sc1">
              <i class="zmdi zmdi-home"></i> Home </a>
            <ul id="sc1" class="card-collapse collapse" role="tabpanel" aria-labelledby="sch1">
              <li>
                <a href="index.html">Default Home</a>
              </li>
              <li>
                <a href="home-generic-2.html">Home Black Slider</a>
              </li>
              <li>
                <a href="home-landing.html">Home Landing Intro</a>
              </li>
              <li>
                <a href="home-landing3.html">Home Landing Video</a>
              </li>
              <li>
                <a href="home-shop.html">Home Shop 1</a>
              </li>
            </ul>
          </li>
          <li class="card" role="tab" id="sch2">
            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#slidebar-menu" href="#sc2" aria-expanded="false" aria-controls="sc2">
              <i class="zmdi zmdi-desktop-mac"></i> Pages </a>
            <ul id="sc2" class="card-collapse collapse" role="tabpanel" aria-labelledby="sch2">
              <li>
                <a href="page-about.html">About US</a>
              </li>
              <li>
                <a href="page-team.html">Our Team</a>
              </li>
              <li>
                <a href="page-product.html">Products</a>
              </li>
              <li>
                <a href="page-services.html">Services</a>
              </li>
              <li>
                <a href="page-faq.html">FAQ</a>
              </li>
              <li>
                <a href="page-timeline_left.html">Timeline</a>
              </li>
              <li>
                <a href="page-contact.html">Contact Option</a>
              </li>
              <li>
                <a href="page-login.html">Login</a>
              </li>
              <li>
                <a href="page-pricing.html">Pricing</a>
              </li>
              <li>
                <a href="page-coming.html">Coming Soon</a>
              </li>
            </ul>
          </li>
          <li class="card" role="tab" id="sch4">
            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#slidebar-menu" href="#sc4" aria-expanded="false" aria-controls="sc4">
              <i class="zmdi zmdi-edit"></i> Blog </a>
            <ul id="sc4" class="card-collapse collapse" role="tabpanel" aria-labelledby="sch4">
              <li>
                <a href="blog-sidebar.html">Blog Sidebar 1</a>
              </li>
              <li>
                <a href="blog-sidebar2.html">Blog Sidebar 2</a>
              </li>
              <li>
                <a href="blog-masonry.html">Blog Masonry 1</a>
              </li>
              <li>
                <a href="blog-masonry2.html">Blog Masonry 2</a>
              </li>
              <li>
                <a href="blog-full.html">Blog Full Page 1</a>
              </li>
              <li>
                <a href="blog-full2.html">Blog Full Page 2</a>
              </li>
              <li>
                <a href="blog-post.html">Blog Post 1</a>
              </li>
              <li>
                <a href="blog-post2.html">Blog Post 2</a>
              </li>
            </ul>
          </li>
          <li class="card" role="tab" id="sch5">
            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#slidebar-menu" href="#sc5" aria-expanded="false" aria-controls="sc5">
              <i class="zmdi zmdi-shopping-basket"></i> E-Commerce </a>
            <ul id="sc5" class="card-collapse collapse" role="tabpanel" aria-labelledby="sch5">
              <li>
                <a href="ecommerce-filters.html">E-Commerce Sidebar</a>
              </li>
              <li>
                <a href="ecommerce-filters-full.html">E-Commerce Sidebar Full</a>
              </li>
              <li>
                <a href="ecommerce-filters-full2.html">E-Commerce Topbar Full</a>
              </li>
              <li>
                <a href="ecommerce-item.html">E-Commerce Item</a>
              </li>
              <li>
                <a href="ecommerce-cart.html">E-Commerce Cart</a>
              </li>
            </ul>
          </li>
          <li class="card" role="tab" id="sch6">
            <a class="collapsed" role="button" data-toggle="collapse" data-parent="#slidebar-menu" href="#sc6" aria-expanded="false" aria-controls="sc6">
              <i class="zmdi zmdi-collection-image-o"></i> Portfolio </a>
            <ul id="sc6" class="card-collapse collapse" role="tabpanel" aria-labelledby="sch6">
              <li>
                <a href="portfolio-filters_sidebar.html">Portfolio Sidebar Filters</a>
              </li>
              <li>
                <a href="portfolio-filters_topbar.html">Portfolio Topbar Filters</a>
              </li>
              <li>
                <a href="portfolio-filters_sidebar_fluid.html">Portfolio Sidebar Fluid</a>
              </li>
              <li>
                <a href="portfolio-filters_topbar_fluid.html">Portfolio Topbar Fluid</a>
              </li>
              <li>
                <a href="portfolio-cards.html">Porfolio Cards</a>
              </li>
              <li>
                <a href="portfolio-masonry.html">Porfolio Masonry</a>
              </li>
              <li>
                <a href="portfolio-item.html">Portfolio Item 1</a>
              </li>
              <li>
                <a href="portfolio-item2.html">Portfolio Item 2</a>
              </li>
            </ul>
          </li>
          <li>
            <a class="link" href="component-typography.html">
              <i class="zmdi zmdi-view-compact"></i> UI Elements</a>
          </li>
          <li>
            <a class="link" href="page-all.html">
              <i class="zmdi zmdi-link"></i> All Pages</a>
          </li>
        </ul>
        <div class="ms-slidebar-social ms-slidebar-block">
          <h4 class="ms-slidebar-block-title">Social Links</h4>
          <div class="ms-slidebar-social">
            <a href="javascript:void(0)" class="btn-circle btn-circle-raised btn-facebook">
              <i class="zmdi zmdi-facebook"></i>
              <span class="badge-pill badge-pill-pink">12</span>
              <div class="ripple-container"></div>
            </a>
            <a href="javascript:void(0)" class="btn-circle btn-circle-raised btn-twitter">
              <i class="zmdi zmdi-twitter"></i>
              <span class="badge-pill badge-pill-pink">4</span>
              <div class="ripple-container"></div>
            </a>
            <a href="javascript:void(0)" class="btn-circle btn-circle-raised btn-google">
              <i class="zmdi zmdi-google"></i>
              <div class="ripple-container"></div>
            </a>
            <a href="javascript:void(0)" class="btn-circle btn-circle-raised btn-instagram">
              <i class="zmdi zmdi-instagram"></i>
              <div class="ripple-container"></div>
            </a>
          </div>
        </div>
      </div>
    </div>
    <script src="assets/js/plugins.min.js"></script>
    <script src="assets/js/app.min.js"></script>
    <script src="assets/js/configurator.min.js"></script>
    <script>
      (function(i, s, o, g, r, a, m)
      {
        i['GoogleAnalyticsObject'] = r;
        i[r] = i[r] || function()
        {
          (i[r].q = i[r].q || []).push(arguments)
        }, i[r].l = 1 * new Date();
        a = s.createElement(o),
          m = s.getElementsByTagName(o)[0];
        a.async = 1;
        a.src = g;
        m.parentNode.insertBefore(a, m)
      })(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
      ga('create', 'UA-90917746-2', 'auto');
      ga('send', 'pageview');
    </script>
  </body>
</html>